title: $emit event from children to parent item that is inside a v-for in VueJS
body: <p>let's say I got the following structure:</p>
  
  <pre><code>// parent template
  &lt;div v-for="item in items"&gt;
     &lt;span&gt;Parent&lt;/span&gt;
     &lt;children1&gt;
        // inside children1, i got another children
        &lt;children2 @on:finished="onFinished"&gt;&lt;/children2&gt;
        &lt;button&gt;Click me&lt;/button&gt;
     &lt;/children1&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Then in the children1 <code>methods</code> i would have something like this to listen children2:</p>
  
  <pre><code>methods: {
      onFinished: function () {
         // Here i would like to disable `click me` button and change its text for this particular item inside the iteration
      }
  }
  </code></pre>
  
  <p>From children2 I just execute this when something finishes in there.</p>
  
  <pre><code>this.$emit('on:finished', true)
  </code></pre>
  
  <p>As I write in the inside of the method, I would like to be able to change with VueJS only one of the items by the $emit from its children. But I was thinking using a data property, but that would affect the entire template, what about using computed maybe? will that work? but how?</p>
  
  <p>Any suggestions?</p>