解決$store.getters調(diào)用不執(zhí)行的問題
api：https://vuex.vuejs.org/zh/guide/getters.html
場(chǎng)景：
在登錄時(shí)將登錄得到的用戶信息存儲(chǔ)在vuex的state和sessionStorage中。使用時(shí)在state中獲取，當(dāng)因?yàn)樗⑿碌仍驅(qū)е聅tate中沒有數(shù)據(jù)時(shí)，去sissionStorage中獲取。
錯(cuò)誤：
登錄后，需要獲取用戶信息時(shí)，getters中屬性的方法不會(huì)執(zhí)行。只是去getters中獲取緩存
解決方法：
將getters中的屬性改寫成方法，這樣每次調(diào)用的時(shí)候就會(huì)執(zhí)行，去從新獲取數(shù)據(jù)。
getloginInfor: (state) => () => {}
代碼：
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
/* 登錄用戶信息 */
loginInfor: {
}
},
mutations: {
setloginInfor (state, msg) {
state.loginInfor = msg
}
},
actions: {
},
getters: {
getloginInfor: (state) => () => {
// 先從state里面獲取用戶登錄信息
let loginInfo = state.loginInfo
// 如果 state 里面獲取不到，那么從localStorage里面獲取
if (!loginInfo) {
loginInfo = JSON.parse(sessionStorage.getItem('loginInfo'))
}
return loginInfo
}
}
})
使用：
this.$store.getters.getloginInfor()
鉆研不易，轉(zhuǎn)載請(qǐng)注明出處。。。。。。
以上這篇解決$store.getters調(diào)用不執(zhí)行的問題就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了vue 中filter的多種用法,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，需要的朋友參考下吧2018-04-04
在Vue+Ts+Vite項(xiàng)目中配置別名指向不同的目錄并引用的案例詳解
這篇文章主要介紹了在Vue+Ts+Vite項(xiàng)目中配置別名指向不同的目錄并引用,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2024-01-01
Vue使用Element折疊面板Collapse如何設(shè)置默認(rèn)全部展開
這篇文章主要介紹了Vue使用Element折疊面板Collapse如何設(shè)置默認(rèn)全部展開，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-01-01
解決VUE中document.body.scrollTop為0的問題
今天小編就為大家分享一篇解決VUE中document.body.scrollTop為0的問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2018-09-09
vue子組件實(shí)時(shí)獲取父組件的數(shù)據(jù)實(shí)現(xiàn)
本文主要介紹了vue子組件實(shí)時(shí)獲取父組件的數(shù)據(jù)實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-12-12
vue語(yǔ)法自動(dòng)轉(zhuǎn)typescript(解放雙手)
這篇文章主要介紹了vue語(yǔ)法自動(dòng)轉(zhuǎn)typescript，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09
今天小編就為大家分享一篇Vue中的v-for指令不起效果的解決方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2018-09-09
使用Vue3封裝實(shí)現(xiàn)支持Base64導(dǎo)出的電子簽名組件
這篇文章主要為大家詳細(xì)介紹了使用Vue3封裝實(shí)現(xiàn)支持Base64導(dǎo)出的電子簽名組件的相關(guān)知識(shí),文中的示例代碼講解詳細(xì),有需要的小伙伴可以了解下2025-03-03
詳解vue項(xiàng)目構(gòu)建與實(shí)戰(zhàn)
這篇文章主要介紹了詳解vue項(xiàng)目構(gòu)建與實(shí)戰(zhàn)，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2017-06-06
下面小編就為大家分享一篇Vue用v-for給src屬性賦值的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2018-03-03