一)在main.js文件中创建Bus实例
new Vue({
router,
//全局事件总线$bus配置
> beforeCreate() {
> Vue.prototype.$bus = this
},
render: h => h(App)
}).$mount('#app')
二)这样就可以组件之间的通信
1)组件①需要给 组件② 传递数据
2)在组件①.vue文件中发起数据
data() {
return {
a: data,
};
},
this.$bus.$emit("clear",a);
3)在组件②.vue接受数据
在生命周期中mounted中接受数据
data() {
return {
b:null,
};
},
mounted() {
//通过全局事件总线清除关键字
//val参数是发送方发过来的数据
this.$bus.$on("clear", (val) => {
this.b=val
});
},