vue--事件总线EventBusEventBus也称为事件总线。在Vue中，EventBus可以作为组件传递数据的桥梁，就像所有的组件共享同一个事件中心，可以向中心注册发送事件或者接收事件，这样组件就可以并行上下通知其他组件，但也太方便了，所以如果使用不慎，就会造成难以维护的灾难。因此，需要一个更完善的Vuex作为状态管理中心，将通知的概念提升到共享状态层面。官方推荐的状态管理方案是Vuex。但是如果项目不是很大，状态管理不是很复杂，就没有必要使用Vuex。使用EventBus初始化第一种方式：可以在main.js中初始化EventBusVue.prototype.$EventBus=newVue()第二种方式：创建一个Bus.js，然后创建一个事件总线，导出给其他模块使用即可或者听听它//Bus.jsimportVuefrom'vue'exportconstEventBus=newVue();您需要做的就是导入Vue并导出它的一个实例（在本例中，我将其称为EventBus）。本质上，它是一个没有DOM的组件，只有它的实例方法，所以可移植性很强。现在我们已经创建了EventBus，您需要做的就是将它加载到您的组件中并调用与在父组件和子组件之间传递消息相同的方法。发送和接收事件其实类似于父子组件之间的通信。使用EventBus.$emit('emiteventname',data)发送，EventBus.$on("emiteventname",callback(payload1,…))接受现在假设AComponent与Bcomponent{{msgB}}
-{{msgA}}
-<脚本>从“../event-bus.js”导入{EventBus}；exportdefault{data(){return{msg:''}},mounted(){EventBus.$on("aMsg",(msg)=>;{//b组件接受a发送的消息this.msg=msg;});},methods:{sendMsgB(){EventBus.$emit("bMsg",'来自页面b的消息');//b发送数据}}};如果只监听（接受）一次数据，可以使用EventBus.$once('eventname',callback(payload1,...)去掉事件监听EventBus.$off('事件名',回调函数)EventBus.$off('事件名',callback)，只移除本次回调的监听EventBus.$off('事件名')，移除本次事件的所有监听.EventBus.$off(),移除所有事件监听器，注意不需要添加任何参数。//导入我们刚刚创建的EventBusimport{EventBus}from'../Bus.js'//事件监听器函数constclickHandler=function(clickCount){console.log(`Oh,hello)`)}//开始监听事件EventBus.$on('i-got-clicked',clickHandler);//停止监听EventBus.$off('我被点击',clickHandler);GlobalEventBus全局EventBus虽然在某些示例中已弃用，但它是跨组件共享数据的一种非常好用且简单的方法。它适用于发布/订阅方法，通常称为Pub/Sub。由于它是全局的，所有事件都必须订阅它，所有组件也发布到它，订阅的组件得到更新。也就是说，所有组件都能够向总线发布事件，然后总线被另一个组件订阅，然后订阅它的组件将得到更新。创建全局EventBus全局事件总线无非是一个简单的vue组件。varEventBus=newVue();Object.defineProperties(Vue.prototype,{$bus:{get:function(){returnEventBus}}})//这个初始化的第一种方法，个人感觉区别不大使用$on和$emit是这个特定总线中使用的两种方法。一个用于创建发出的事件，即$emit；另一个用于订阅$on:this.$bus.$emit('nameOfEvent',{...passsomeeventdata...});this.$bus.$on('nameOfEvent',($event)=>{//...})EventBus的优缺点大家都知道vue是单页应用。如果刷新某个页面，与它相关的EventBus会被移除，从而导致业务无处可去。如果业务有重复操作的页面，在监控的时候会多次触发EventBus，这也是一个非常大的隐患。这时候我们就需要处理好项目中EventBus的关系。通常用于在vue页面销毁时同时移除EventBus事件监听。由于使用了Vue实例，容易出现重复触发。两个页面都定义了相同的事件名称，并且不会用$off销毁（通常在切换路由时发生）。优点解决了多层组件之间繁琐的事件传播。使用原理非常简单，代码量小。转载并引用vue文章中的事件总线（EventBus）使用Vue.js创建全局事件总线Vue事件总线（EventBus）使用详细介绍
