vue中eventbus被屢次觸發（vue中使用eventbus踩過的坑）【bus.$on事件被屢次綁定】

 

問題描述：只要頁面沒有強制刷新，存在組件切換，bus.$on方法會被屢次綁定，形成事件屢次觸發

 

觸發bus.$on中綁定的方法.png

 

bus.$on屢次綁定.png

解決辦法：在每次調用方法前先解綁事件( bus.$off )，而後在從新綁定( bus.$on )

bus.$off("backUpLevel"); bus.$on('backUpLevel', () => { if(self.ONION.length <= 1){ self.jumpSubDir() }else{ let len = self.ONION.length-1 self.jumpTeamId(self.ONION[len].id,self.ONION[len].name,self.ONION[len].type) } }) 

 

每次綁定前解綁bus.$on方法.png

解決：
看一下github上提出的。issue
https://github.com/vuejs/vue/issues/3399

 

image.png

尤大大提出瞭如下解決：

 

image.png

*就是說，這個$on事件是不會自動清楚銷燬的，須要咱們手動來銷燬。（不過我不太清楚這裏的external bus 是什麼意思，有大神能解答一下的嗎，尤大大也提到若是是註冊的是external bus 的時候須要清除）****

因此。我在B組件頁面中添加Bus.$off來關閉。代碼以下：

// 在B組件頁面中添加如下語句，在組件beforeDestory的時候銷燬。 beforeDestroy () { bus.$off('get', this.myhandle) },