[Vuejs]-Vuejs bind custom event on nested component within for loop

by

0👍

You might want to try emitting markedFilled event to parent component:

In ParentVariation.vue

<variation-info :filled="row.filled" @markedFilled="$emit('markedFilled')" :key="row.id">
</variation-info>

and in main

<parent-variation v-for="(parent, index) in parents" :row="parent" :key="parent.id" @markedFilled="changeFilled(index)">
</parent-variation>

export default {
  data: function() {
   return {
       parents: [{ id:0, child: [], filled:'' }]
   }
  },
  methods: {
    changeFilled(index) {
      this.parents[index].filled = true
      this.parents = JSON.parse(JSON.stringify(this.parents))
    }
  }
}
👤ittus

Leave a comment