与孙子组件的通信

Question

我将三个组件命名为

A.vue > B.vue（A 的子组件）> C.vue（B 的子组件）

A直接从核心后端接收数据。我想将数据传递给 C。我目前正在使用 Props 来执行此操作，其中 A 将数据发送给 B，B 将数据发送给 C。

它有效，但我很想知道是否有更有效的方式进行这种交流。

Answer 1

全局事件总线是处理此问题的常用方法。

// event-bus.js
const bus = new Vue()
export default bus

然后您可以在您的组件中导入 event-bus.js 并通过以下方式进行通信：

bus.$emit('event', 'payload')
....
bus.$on('event', payload => { ... })

不过，我更喜欢为此利用状态管理器 vuex。 Store/module 状态的反应性允许您观察 commiting 突变时的变化。 mapGetters, mapMutations, and mapActions 在这里很有帮助。