Vue事件总线EventBus

在vue里面两个不相关的页面，比如Atab页面打开到Btab页面，在B页面中操作了一下，回到A页面，希望刷新UI，怎么实现呢？
普通的父子组件间传递消息通信，可以用props传值传回调函数，这种两个页面的可以用eventbus来解决。
1.定义EventBus
在main.js里挂载EventBus
import Vue from 'vue' Vue.prototype.$EventBus = new Vue()
2.在A页面的mounted方法中定义接收的事件方法
mounted(){ console.log('mounted=========') this.$EventBus.$on("refreshRecord", (msg) => { // A发送来的消息 //alert(msg); this.refresh(); }); },
3.在B页面定义发送事件的方法，比如在点击返回的时候发送刷新事件
goBack() { window.history.back(); this.$EventBus.$emit('refreshRecord','刷新UI'); },

这样就可以全局发送接收消息了，这里面要注意发送的事件和接收事件的名称要一致，比如都是refreshRecord。