前言
事情的經過是這樣的,項目里有一個全局使用的websocket,開始的時候websocket的初始化和接收message都寫入到了App.vue的methods里了. websocket接收到消息后會統計數量, 數量存儲到了vuex里. 這時候就發生了一個詭異的事情. 通過this.$store.dispatch("fun")去更新vuex中的數據. 會出現this.$store.dispatch調用的action函數被執行了兩次的問題,怎么找原因都無果,google更是沒有任何頭緒
websocket的回調message如下
vuex的store定義是這樣的
大概邏輯就是每次來消息,我給變量自增1.
發現問題原因
偶然的一次打印中,我發現, 就算if的條件為假, if里面包裹的this.$store.dispatch函數還是會被調用, 只有把this.$store.dispatch注釋掉,才不會執行action里的函數. 這下就尷尬. 原因不詳
解決辦法
把websocket的代碼全部移入到Home.vue, 問題解決
總結
不要在App.vue里寫邏輯代碼,App.vue就充當項目入口即可.