Vue中bus總線的使用。

vue中可能會遇到兩個沒有關系的組件之間的通信。

npm install vue-bus

引入

import Vue from 'vue';
import bus from 'vue-bus';
Vue.use(bus);

創建發送數據

this.$bus.emit("eventName",data)

響應接收數據

this.$bus.on("eventName",(data) => { console.log(data)})

this的作用域要指向當前的vm實例，on監聽事件一般放在組件生命周期函數中的created或者mounted中，注銷bus需要在beforeDestroy中；

頁面路由的時候，原有頁面中的bus事件並沒有被注銷，依然隱藏在程序中，注冊的總線事件要在組件銷毀時卸載，否則會多次掛載，造成觸發一次但多個響應的情況可以在離開界面時注銷bus。

beforeDestroy () {
    this.$bus.$off('eventName',this.todo);
}