http://www.mamicode.com/info-detail-2246525.html
解決了爲什麼vue event bue 傳值失敗的問題
以上鍊接內容：
思路：
1.定義一個空的Vue實例，作爲中央事件總線。
2.A組件定義方法去觸發自定義事件
3.B組件在鉤子裏面去監聽
OK！看似很簡單，實踐起來卻賊雞兒坑，一共遇到3個問題：
1.A組件觸發的事件在B組件中可以console顯示，但是不能更新視圖。
2.A通過路由跳轉至B，第一次是無法console出傳遞過來的數值的（第二次以後就可以）。
3.第二次傳過來的數據依次是遞增的。
我們來一個一個分析解決：
問題一：最初判斷是生命週期函數出了問題，經過分析發現是可以console出來應該是this指向的問題，最初寫法：
mounted () {
Bus.$on(‘msg‘, function (data) {
this.message = data // this指向錯誤，該this指向Vue實例
})
}
於是分析，該this應該指當前事件，改爲：
mounted () {
Bus.$on(‘msg‘, (data) => { //箭頭函數沒有自己的this, 它的this是繼承而來; 默認指向在定義它時所處的對象(宿主對象),而不是執行時的對象, 定義它的時候,可能環境是window
this.message = data
})
}
改爲 箭頭函數 之後就解決了傳遞過去的數據不更新視圖的問題了！
問題二：爲什麼第一次在A中觸發事件，B中卻沒有打印呢？
上圖分別爲B A組件生命週期，我們可以明確的看到跳轉至B組件的時候，A中的事件並沒有觸發，現在明白了吧，通過分析有兩種解決方案：
1.使用this.$nextTick(在下次 DOM 更新循環結束之後執行延遲迴調)，也就是說，等B組件dom準備完成後在觸發這個方法，親測沒問題！
2.在beforeDestroy鉤子中去觸發事件，親測有效！
問題三：傳遞的數據爲什麼會遞增呢？
是因爲B中的事件一直存在，所以會導致每次都會監聽上次觸發的事件，解決辦法：在B中beforeDestroy中使用Bus.$off(‘事件‘)去解綁這個事件，親測有效！