标签：vue 自定义 bus 总线 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

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。