最近在學(xué)vuex，將store分割成module的時候踩了一些坑，現(xiàn)做以下記錄以記之：
分割后目錄結(jié)構(gòu)如下：
問題出在status.js和users.js這兩個模塊
現(xiàn)在有個需求是實現(xiàn)登錄成功后顯示用戶名和退出標(biāo)簽，隱藏登錄和注冊標(biāo)簽交胚。但是按照以上代碼這樣寫，發(fā)現(xiàn)登錄狀態(tài)并沒有改變。也就是登錄成功后色难，“登錄”和“注冊”標(biāo)簽仍然會顯示，而用戶名也顯示等缀，“退出”標(biāo)簽則隱藏枷莉。。尺迂。什么鬼笤妙？這不是矛盾嗎？噪裕？
困擾了我兩天蹲盘，今天終于解決了
原因：登錄成功后將users.js里的state.isLogin設(shè)置為true，而通過this.$store.getters.isLogin取到的是status.js里的isLogin膳音，值為false召衔，兩個模塊的state是不互通的，所以數(shù)據(jù)會不同步祭陷。
解決方法：
把status.js里的isLogin移到users.js里苍凛，刪掉status.js
注意：將store分割成module獲取state時要用注意命名空間，即this.$store.state.模塊名.屬性名颗胡，如果寫成this.$store.state.屬性名容易報錯毫深，會出現(xiàn)state未定義。盡量用getters獲取屬性的狀態(tài)不要直接用state毒姨，即this.$store.getters.屬性名
采坑2：
想通過路由守衛(wèi)獲取登錄狀態(tài)后實現(xiàn)跳轉(zhuǎn)
一開始寫成this.$store哑蔫，報錯，獲取不到弧呐。因為這是在路由中闸迷，this的指向不是vue的實例(如果是在組件中才是)，所以需要在路由文件引入store俘枫，即import {store}from './store/store.js'腥沽，然后直接寫store.xxx即可。
參考https://blog.csdn.net/qq_39523111/article/details/79638614
