vue 任意组件间通信-全局事件总线（GlobalEventBus）

全局事件总线（GlobalEventBus）

一种组件间通信的方式，适用于任意组件间通信

安装全局事件总线

main.js入口文件配置

  new Vue({
  	......
  	beforeCreate() {
  		Vue.prototype.$bus = this //安装全局事件总线，$bus就是当前应用的vm
  	},
      ......
  }) 

使用事件总线

1、接收数据：A组件想接收数据，则在A组件中给$bus绑定自定义事件，事件的回调留在A组件自身。

     methods(){
       demo(data){......}
     }
     ......
     mounted() {
       this.$bus.$on('eventName',this.demo)
     }

2、提供数据,触发事件：

this.$bus.$emit('eventName',数据)

最好在beforeDestroy钩子中，用$off去解绑当前组件所用到的事件。

使用解绑单个自定义事件的方式，不能使用$off()这样解绑全部自定义事件了，把其它组件的都解绑了。

  beforeDestroy() {
	 this.$bus.$off('enentName')
	}

为什么要解绑呢？就放着不行吗？
因为$bus绑定了很多组件的自定义事件，如果不解绑，那其实这个是多余的事件，不合理了

标签：vue,自定义,bus,总线,GlobalEventBus,间通信,事件,组件,解绑
来源： https://www.cnblogs.com/qingheshiguang/p/15048694.html