vue八全局时间总线

---

全局事件总线（GlobalEventBus）

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

1. 想实现一个公共组件 所有组件都可以用它来绑定事件 调用函数 所有组件都可以用它来触发事件 传递参数

2. 所有为了让所有组件都可以看到这个组件 所以让它成为 原型上的一个东西 且必须是组件(因为要用$on $emit这个是vue原型的东西 所以只有vm或者vc可以使用)

3. 让它成为谁的原型 才可以让所有组件看到 可以让它成为一个vue原型上的东西

根据这张图可知 成为vue原型的东西 vm vc都可以拿到
4. 如果让这个公共组件成为vc可以 但是还需要创建一个 const Dm=vue.extend() (因为每次调用vue.extend 就是创建了一个vuecomponent构造函数Dm)
const d=new Dm(如何才能创建vc实例 要么写一个标签 要么自己用构造函数new一个) 这是d才是一个vc 然后 vue.prototype.$bus=d
但是这样太过麻烦
5. 不如 让它成为vm
并且 必须让它在创建之前 如果在外面 都已经挂载
安装全局事件总线：

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

使用事件总线：

（1）接收数据：A组件想接收数据，则在A组件中给$bus绑定自定义事件，事件的回调留在A组件自身。
绑定事件 一般写在mounted里面 调用函数写在methods里面 别忘了在销毁前解绑

methods(){
  demo(data){......}
}
.....

 mounted() {
    this.$bus.$on('checkAllTodo',this.checkAllTodo)
    this.$bus.$on('deleteTodo',this.deleteTodo)
  },
  beforeDestroy() {
    this.$bus.$off('checkAllTodo')
    this.$bus.$off('deleteTodo')
  },

（2）提供数据：
因为要触发事件 所以绑定一个按钮 然后写在methods里面

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