结合sessionStorage解决vuex页面刷新数据丢失的问题


将需要保存在vuex中的数据同时保存在sessionStorage中即可:

import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);

const state = {
    count: 0,
};

const mutations = {
    increaseCount(state, num) {
        state.count = state.count + num;
        sessionStorage.setItem('count', JSON.stringify(state.count));
    },
    reduceCount(state, num) {
        state.count = state.count - num;
        sessionStorage.setItem('count', JSON.stringify(state.count));
    }
}
// 页面刷新时,会从sessionStorage中重新读取并赋值
for(let key in state) {
    sessionStorage.getItem(key) ? state[key] = sessionStorage.getItem(key) : false;
}
export default new Vuex.Store({
    state,
    mutations
})

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM