在開發中發現其中一個頁面moutned調用了兩次,而其他頁面正常,表示很懵逼,然后查找原因,終於找到了,其實歸根到底是要知道mounted的調用機制問題;
情況:在這個頁面中出現了mounted 加載了兩次的情況;
方法:排除法
首先把 this.$store.commit() 方法注釋掉,發現就好了,只加載一次
初步判斷是commit 方法導致的
二 驗證判斷是否正確,不使用commit 方法,該用直接改變變量狀態的方法,發現又加載了兩次;
再次判斷,不是由於commit引起的
三 猜想commit到底實現了什么邏輯,然后找到了v-if
v-if會重新渲染頁面,而mounted 又是在重新渲染完成之后調用的,所以猜想是v-if導致的
然后換成v-show 發現完美解決問題;
v-show 不會重新加載頁面,僅僅是顯示隱藏而已;
從網上找來的生命周期圖,各位網友可以了解一下,希望給你帶來一些啟發;
