javascript - Vue2在循环组件中从子级调用父级方法

我正在循环使用带有子组件的根组件。

<root-select v-for="offer in offers"  >
   <child-options v-for="item in options" >
   </child-options>
</root-select>

但是，当我从子级$emit生成根函数时，我所有的根组件都更改了这些数据。

儿童：

EventBus.$emit('toggle', value);

根：

EventBus.$on('toggle', this.toggle);

但我需要，数据仅在触发的组件中发生变化。

谢谢。

最佳答案

尽量不要使用事件总线发出。使用正常的发射方式从孩子向父母发射。

在子组件功能中：

this.$emit('toggle', value);

在父组件功能中：

<template><child-options v-for="item in options" @toggle="onToggleFn"></child-options></template>

<script>
...
methods:{
     onToggleFn:function(){
         //your logic here
     }
}
</script>