vue中bus.$on事件被多次綁定

例子

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

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

 

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

 

bus.$on多次綁定.png

解決辦法一：在每次調用方法前先解綁事件( bus.$off )，然后在重新綁定( bus.$on )

 

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

解決辦法二：注冊的總線事件（Bus）要在組件銷毀時(beforeDestroy/destroyed)卸載，否則會多次掛載，造成觸發一次但多個響應的情況

 

beforeDestroy () {
        bus.$off("backUpLevel");
  }