鍍金池/ 問答/HTML/ vuex中提交mutations的時候保存到localstorage,想在刷新時

vuex中提交mutations的時候保存到localstorage,想在刷新時從state新獲取localstorage。

代碼如下:

Vue.use(Vuex)
const localLoginData = global.localStorage;
const store = new Vuex.Store({
  state: {
    logindata:JSON.parse(localStorage.getItem('logindata')),    // 初始化vuex,刷新時獲取localstorage
    form1: {}  //登錄信息
  },
  getters:{
    getUserInfo:(state)=>state.logindata==null?'':state.logindata,
  },
  mutations: {
    updatelogindata(state, logindata) {
      state.logindata = logindata;
      localStorage.setItem('logindata',JSON.stringify(logindata));// 提交mutation成功后保存logindata到localStorage
    },
    updatamessage(state, form1) {
      state.form1 = form1
    }
    
  },

為什么一刷新還是state還是清空了,明明已經(jīng)保存成功到了localstorage里了啊,試過很多方法了,難道vuex不能實現(xiàn)持久化緩存么?

回答
編輯回答
涼汐
  1. 登錄信息也保存一下,在 state.form1 = form1 后面;
  2. const localLoginData = global.localStorage 這句可以不用。
2017年9月21日 10:50
編輯回答
法克魷

你可以通過actions來獲取logindata的值

 mutations: {
   getUsers(state, e){
      state.logindata = e;
      
    },
 },
 actions: { 
    getUser ({ commit }) {
      let logindata = JSON.parse(localStorage.getItem('logindata'));
      commit('getUsers',logindata );
    }
  },


this.$store.dispatch('getUser');

這樣state就有值了。

2017年12月23日 17:50
編輯回答
夏夕

我寫的一個 小工具 https://github.com/qinouz/vue... 能解決你的問題

2018年2月18日 11:31
編輯回答
病癮

看到這個問題我也想不通,然后我按你的思路試了一下,能很好的工作,所以在vuex的mutation里將數(shù)據(jù)保存到localstorage應(yīng)該是沒有問題的,你還得仔細查一下代碼是不是哪個地方寫的有問題。

2017年3月21日 13:14
編輯回答
艷骨

這個應(yīng)該可以結(jié)局你的問題
鏈接描述

2017年9月14日 08:24