全局事件总线

一种组件间通信的方式，适用于任意组件间通信

首先我们要在Vue的main.js中先配置全局事件

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

父组件的写法:

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

  methods(){
    demo(data){......}
  }
  ......
  mounted() {
    this.$bus.$on('自定义方法名',this.demo)
  }

子组件的写法:

提供数据：this.$bus.$emit('接受自定义的方法名',数据)

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

消息订阅与发布

一种组件间通信的方式，适用于任意组件间通信

首先安装消息订阅与发布

1. 安装pubsub：npm i pubsub-js
2. 引入: import pubsub from 'pubsub-js'

父组件的写法：

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

   methods(){
     demo(data){......}
   }
   ......
   mounted() {
     this.pid = pubsub.subscribe('自定义方法名',this.demo) //订阅消息    $on
   }

子组件的写法:

pubsub.publish(“自定义方法名”,参数);

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