vue bus的使用

使用Bus.js进行兄弟(非父子)组件通信

1.首先写bus.js文件
任意地方添加一个bus.js，在bus.js里面 写入下面信息

import Vue from 'vue';
const bus = new Vue();
export default bus;

2.在需要通信的组件都引入bus.js
from后面就改成你的所放bus.js文件的位置

import Bus from './bus.js'

3.需要发送事件的组件使用 bus.$emit 发送事件

this.$bus.$emit('test', '测试一下');

4.接受事件的组件使用 bus.$on 在钩子中接收事件

this.$bus.$on('test', (data: any) => {
      console.log(data);
});

5.bus.$off注销事件
需要注销的原因：https://blog.csdn.net/bus_lupe/article/details/85341889
bus是全局变量，防止已有的事件影响