$store.getters調用不執行

$store.getters調用不執行

api：https://vuex.vuejs.org/zh/guide/getters.html

場景：

在登陸時將登陸獲得的用戶信息存儲在vuex的state和sessionStorage中。使用時在state中獲取，當由於刷新等緣由致使state中沒有數據時，去sissionStorage中獲取。

錯誤：

登陸後，須要獲取用戶信息時，getters中屬性的方法不會執行。只是去getters中獲取緩存

解決方法：

將getters中的屬性改寫成方法，這樣每次調用的時候就會執行，去重新獲取數據。

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()

 

 

鑽研不易，轉載請註明出處。。。。。。