一開始的需求是這樣子的，我為了實現兩個頁面元件之間的資料傳遞，假設我有頁面a，點選頁面a上的某乙個按鈕之後，頁面會自動跳轉到頁面b，同時我希望將頁面a上的某一些引數攜帶過去給頁面bbogggdrea。（我知道，小引數的時候可以通過路由的params或者query去傳引數，或者大型資料可以用vuex來處理，很遺憾我到現在還沒有做很大型的專案，所以還沒有用過vuex，接下來會學習一下。）
然後我就想，這不就是不同元件之間的資料傳遞問題而已嗎？直接用bus 巴士事件來傳遞資料不就行了嗎。於是，我就很愉快地進行了。關於vue中的eventbus的使用，我之前在一篇vue中的資料傳遞中有提到過。
先給你們看一下我一開始的**：
實現目標：
點選之後，bus emit事件，然後順便跳轉路由到/moneyrecord頁面。
接下來就是在moneyrecord頁面中去on接收這個事件，然後接受引數。
// 這是頁面a的內部觸發bus事件的**
editlist (index, date, item) )
this.$router.replace()
}// moneyrecord頁面
created () ,
methods:
}就當我欣喜若狂的時候，覺得自己只要在頁面a觸發了get事件，頁面b中就會理所當然的接受了資料。然而，結果卻不如人意，看一下下面的**。
主要是看「」這是從上個頁面傳來的資料這一行資料的輸出次數情況來判斷事件觸發次數。「」
不知道你有沒有發現，就是我第一次進去list頁面的時候，我隨便點選一下程式設計客棧list下的任何乙個item，控制台沒有輸出。但是當我第二次再點選觸發事件的時候，就會輸出乙個測試資料。再一次進去點選，就輸出兩個資料。。。依次增加了。（控制台上那個「這是從上個頁面傳來的資料」就是測試資料）
所以，有兩個問題。
問題：解決
針對問題1
這個還得從vue的生命週期說起了，我先進行了測試，就是當從頁面元件a跳轉到頁面元件b的時候，兩個元件的生命週期分別是怎麼樣的，關於vue的生命週期具體每乙個時期做什麼事情我就不再贅述了，下面po一張vue生命週期的圖。
我自己做了實驗來驗證，這個頁面跳轉過程中，這兩個元件的生命週期的執**況。
// 我分別在頁面a和頁面b中去新增以下**：
beforecreate () ,
created () ,
beforemount () ,
mounted () ,
beforeupdate () ,
updated () ,
beforedestroy () ,
destroyed ()
// 另外乙個元件的我就不放出來了
測試結果圖：
其實，可以通過結果清楚看到，當我們還在頁面a的時候，頁面b還沒生成，也就是頁面b中的 created中所監聽的來自於a中的事件還沒有被觸發。這個時候當你a中emit事件的時候，b其實是沒有監聽到的。
再看一下，紅色的是b頁面元件，當你從頁面a到頁面b跳轉的時候，發生了什麼？首先是先b元件先created然後beforemount接著a元件才被銷毀，a元件才執行beforedestory，以及dest
所以，我們可以把a頁面元件中的emit事件寫在beforedestory中去。因為這個時候，b頁面元件已經被created了，也就是我們寫的$on事件已經觸發了
所以可以，在beforedestory的時候，$emit事件。
// 修改一下a頁面中的**：
// 這是原先的**
editlist (index, date, item) )
}// 重新在data屬性內部定義新的變數，來儲存要傳過去的資料；
然後： beforedestroy () )
},接下來。看一下修改之後的效果
可以看到，就是第一次點選list的時候，也就是第一次觸發emit事件的時候，控制太就輸出了，所以在beforedestoryed去$emit是起到作用的，b頁面元件也監聽$on到了。
但是，好像，就是事件的觸發還是會依次增加，就是控制台的輸出每次都有所增加了。。。
解決：看一下github上提出的。
尤大大提出了以下解決：
*就是說，這個$on事件是不會自動清楚銷毀的，需要我們手動來銷毀。（不過我不太清楚這裡的external bus 是什麼意思，有大神能解答一下的嗎，尤大大也提到如果是註冊的是external bus 的時候需要清除）****
所以。我在b元件頁面中新增bus.$off來關閉。**如下：
// 在b元件頁面中新增以下語句，在元件beforedestory的時候銷毀。
beforedestroy () ,
來看一下輸出www.cppcns.com的結果
t可以看到，控制台第一次進去的時候就有輸出，而且輸出的不會逐次增加
*當然，尤大大還說可以寫乙個mixin？我還不知道是什麼？以後在研究一下。
總結： 所以，如果想要用bus 來進行頁面元件之間的資料傳遞，需要注意亮點，元件a$emit事件應在bebogggdreaforedestory生命週期內。其次，元件b內的$on記得要銷毀。
提問時間：你們在實現頁面元件之間的資料傳遞有什麼好的方法嗎？可以留言分享一下嗎？有時候雖然也可以通過從後台獲取，但是考慮到資料只有幾個需要傳的話，就沒有必要去請求資料，我知道有的還有用vuex傳遞。還有呢？
本文標題: vue中eventbus被多次觸發以及踩過的坑
本文位址:
vue中EventBus的使用
第一步 建立乙個bus.js檔案，建立bus import vue from vue const bus new vue export default bus第二步 在需要互相通訊的元件中引入bus.js檔案 a b元件 import bus from utils bus.js 第三步 元件a中呼叫...
vue中eventBus的使用
eventbus是用於元件間通訊的一種方法，我們都知道在vue中資料流是單向的，那麼非父子元件間的傳值自然值得我們注意 一種是我們都很熟悉的vuex 它可以通過倉庫溝通我們所有元件間的通訊 而另外還存在一種叫做eventbus的方法 使用場景如 兄弟元件間的通訊，父元件fathercom中同時使用到...
eventBus在vue中的使用
在vue專案中，父子元件間的通訊很方便。但兄弟元件或多層巢狀元件間的通訊，就會比較麻煩。這時，使用eventbus通訊，就可以很便捷的解決這個問題。eventbus可以在全域性定義，實現全專案通訊，使用方法也很簡單。1 初始化 全域性定義 全域性定義，可以將eventbus繫結到vue例項的原型上,...