目录

第一种：全局事件总线 

第二种：订阅发布

第三种：vuex

---

第一种：全局事件总线 

1、安装全局事件总线：

new Vue({
    ......
    beforeCreate() {
        Vue.prototype.$bus = this //安装全局事件总线，$bus就是当前应用的vm
    },
    ......
}) 

2、使用数据总线

提供数据：this.$bus.$emit('xxxx',数据) 

接收数据：A组件想接收数据，则在A组件中给$bus绑定自定义事件，事件的回调留在A组件自身。

methods(){
  demo(data){......}
}
......
mounted() {
  this.$bus.$on('xxxx',this.demo)
}

最好在beforeDestroy钩子中，用 $off 去解绑当前组件所用到的事件。

第二种：订阅发布

安装pubsub：

npm i pubsub-js

 引入:

import pubsub from 'pubsub-js'

提供数据：pubsub.publish('xxx',数据) 

接收数据：A组件想接收数据，则在A组件中订阅消息，订阅的回调留在A组件自身。

   methods(){  
    demo(data){......} 
   } 

...... 

   mounted() { 
    this.pid = pubsub.subscribe('xxx',this.demo) //订阅消息
   }

最好在beforeDestroy钩子中，用 PubSub.unsubscribe(pid)去取消订阅。

第三种：vuex

vuex基础总结_Holly 的博客-CSDN博客