文章结构
亲兄弟他们有着共同的父亲,在它们自己组件实例身上有一个$parent属性指向它们共同的
父组件,专栏中在全局事件总线那一篇博客介绍了vue组件身上有$on,$emit,$off三个api。
实现消息发布与订阅模式,实际上这也是消息发布与订阅模式,不过在这里中间人是它们
的父亲
// 接收数据组件
methods: {
btn(){
this.$parent.$off("clg")
this.$root.$off("hello")
}
},
mounted() {
this.$parent.$on("clg", msg => {
console.log(msg)
})
},
// 发送数据组件
methods: {
btn() {
this.$parent.$emit("clg", "msg from Child2");
},
}