非父子组件通信-发布订阅模式

发布订阅模式其实与vue无关，完全是ES6的代码，但是它可以通过这种模式实现非父子组件的通信

store.js文件

首先创建一个store.js文件，用于提供发布与订阅方法

export default {
    datalist: [], //存放带一个参数的函数集合

    //订阅
    subscribe(fun) {
        this.datalist.push(fun) //将一个带一个参数的函数添加到datalist中 
    },

    //发布
    publish(value) {
        this.datalist.forEach(fun=>{  
            fun(value)   //遍历datalist中的函数并且立即执行 （函数带几个参数需要自己根据自己的实际情况来决定）
        })
    } 
}

App.vue组件

我有一个根组件App.vue根组件  它下面有一个AChild.vue子组件，和一个BChild.vue子组件

AChild.vue

BChild.vue