title: Using v-for with v-on:click in a Vue Component
body: <p>I have what I think is a basic question for Vue, but I'm trying to run a method on click while also running a v-for loop on a component.</p>
  
  <p>I'm not sure why but I can't get anything to run on that click handler but I see nothing in the Vue documentation saying that this isn't possible. Right now I'd settle for getting my console log running.</p>
  
  <pre><code>&lt;IconBox
      v-for="step in steps"
      :key="step.slug"
      :step="step"
      :formData="formData"
      @click="console.log('click')"
  /&gt;
  </code></pre>
  
  <p>Here is the template for IconBox.vue:</p>
  
  <pre><code>&lt;template&gt;
    &lt;div class="icon-box"&gt;
      &lt;div
        class="icon-holder"
        :style="{ backgroundImage: 'url(' + step.image + ')' }"
      &gt;
      &lt;/div&gt;
      &lt;div class="text"&gt;
        &lt;div class="inner"&gt;
          &lt;h5&gt;{{ step.name }}&lt;/h5&gt;
          &lt;p v-if="step.description"&gt;{{ step.description }}&lt;/p&gt;
          {{ isSelected }}
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>I could run the click in the component itself but I need the parent well aware of what's happening to handle a selected boolean.</p>