vue.js 非父子组件怎么通信

Question

参照网上找的代码但是我这没有效果(网上的代码如下)：新建一个bus.js内容为下：import Vue from 'vue'export default new Vuea.vueimport Bus from './bus.js'在事件中触发 Bus.$emit('msg', 123)b.vueimport Bus from './bus.js'在created或mounted钩子中接收：Bus.$on('msg', val => {this.nnum = val})请问这种方式可以吗·？ 有没有能给详细解释下的大神

Answer 1

官方文档

非父子组件的通信

有时候，非父子关系的两个组件之间也需要通信。在简单的场景下，可以使用一个空的 Vue 实例作为事件总线：

var bus = new Vue()

// 触发组件 A 中的事件

bus.$emit('id-selected', 1)

// 在组件 B 创建的钩子中监听事件

bus.$on('id-selected', function (id) {

  // ...

})

Answer 2

可以参考下我的这篇文章vue非父子组件之间通信 ，有问题可以继续沟通