全局事件总线:任意组件通信 同级组件之中的通信 分析:让各个组件的实例对象vc,都可以访问到vue原型上的属性,方法 给各组件之间提供通信的平台
//暴露出平台,各个组件都可以访问到
main.js: beforeCreate() {
// 创建前 生命周期钩子
//让各个组件的实例对象vc,都可以访问到vue原型上的属性,方法(组件找vc,vc没有,在找vue)
Vue.prototype.$bus = this;
}
A给B传递信息 A->B:
A: <button @click="send">传递信息给B</button>
methods:{
send(){
//触发事件,把两个信息给B带过去
this.$bus.$emit('v_b',this.msg,this.name);
}
}
B: methods:{
//两个参数接收了A组件发来的信息
getA(value,name){
console.log('我是B',value,name);
}
},
mounted() {
//全局绑定自定义事件
this.$bus.$on('v_b',this.getA);
}
}