0
点赞
收藏
分享

微信扫一扫

Vue刷新vuex数据丢失


安装依赖

npm install vuex-persistedstate

使用

import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from 'vuex-persistedstate'

Vue.use(Vuex)

export default new Vuex.Store({
state: {
/** 用户信息 */
userInfo: {}
},
getters: {
},
mutations: {
},
actions: {},
plugins: [
createPersistedState({
storage: window.sessionStorage
})
]
})

解决JSON.stringify循环依赖的问题

import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from 'vuex-persistedstate'

Vue.use(Vuex)

/** 解决深拷贝问题 */
const getCircularReplacer = () => {
const seen = new WeakSet();
return (key, value) => {
if (typeof value === "object" && value !== null) {
if (seen.has(value)) {
return;
}
seen.add(value);
}
return value;
};
}

export default new Vuex.Store({
state: {
/** 用户信息 */
userInfo: {}
},
getters: {
},
mutations: {
/** 使用示例 */
noteMsg(state, payload) {
state.groupInfo = JSON.parse(JSON.stringify(payload, getCircularReplacer()))
}
},
actions: {},
plugins: [
createPersistedState({
storage: window.sessionStorage
})
]
})

完美解决!


举报

相关推荐

0 条评论