Vue2从循环组件中的子级调用父方法

Question

我正在循环具有子组件的根组件。

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

但是，当我$emit从 child 获取 root 函数时，我所有的 root 组件都更改了这些数据。

孩子：

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

根：

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

但我需要，该数据仅在触发组件中更改。

谢谢。

Answer 1

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

在子组件函数中：

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>