Vue cli 全局事件总线

一、优点

任意组件间通讯

二、安装全局事件总线

mian.js，使用生命周期钩子beforeCreate

new Vue({el:'#app',render: h => h(App),// 生命周期钩子
    beforeCreate() {Vue.prototype.$bus = this},
})

三、使用全局事件组件

B组件传递数据给A组件

1、接受数据(A组件)

回调方法

methods:{checkChekbox(thingID){....});},
}

生命周期钩子

//开启
mounted() {this.$bus.$on('checkChekbox', this.checkChekbox)
},
// 关闭
beforeDestroy() {this.$bus.$off('checkChekbox')
},

2、提供数据(B组件)

methods: {//点选 clickTing 触发事件
    clickThing(thingId){this.$bus.$emit('checkChekbox', thingId)},
},