DvaJS - 将保存的状态从 localStorage 加载到状态中
DvaJS - Load saved state from localStorage into state
我启动了我的 dvajs
应用程序,如下所示。我使用 onStateChange
钩子将状态存储到 localStorage 中。将状态保存到 localstorage
就可以了。
const app = dva({
history: createBrowserHistory(),
defaultState: getPersistedState(),
onError(e) {
message.error(e.message, /* duration */3);
},
onStateChange(state){
window.localStorage.setItem('adligence', JSON.stringify(state));
console.log('state changed', state);
}
});
现在,当页面刷新时,我想将保存的状态加载到应用程序中。所以我写了 getPersistedState()
并将持久状态加载到 defaultState
中。在初始加载时加载良好。
但问题是当模型设置状态道具被模型的默认数据替换时。例如,这是我的模型定义之一。
export default {
namespace: 'training',
state: {
videos: [],
current: {}
}, ....
....
所有加载的初始持久数据都将被此模型替换。那么,如何将 localstorage
值正确加载到状态中以使其保持不变?
在 dva 选项上使用 initialState
而不是 defaultState
。对于模型,将 state
设置为 null
,如果你想添加任何默认道具,也使用 initialState
。
修改代码
Dva 初始化
const app = dva({
history: createBrowserHistory(),
initialState: getPersistedState(),
onError(e) {
message.error(e.message, /* duration */3);
},
onStateChange(state){
window.localStorage.setItem('adligence', JSON.stringify(state));
console.log('state changed', state);
}
});
型号
export default {
namespace: 'training',
initialState: {
videos: [],
current: {}
},
state: null
....
....
我启动了我的 dvajs
应用程序,如下所示。我使用 onStateChange
钩子将状态存储到 localStorage 中。将状态保存到 localstorage
就可以了。
const app = dva({
history: createBrowserHistory(),
defaultState: getPersistedState(),
onError(e) {
message.error(e.message, /* duration */3);
},
onStateChange(state){
window.localStorage.setItem('adligence', JSON.stringify(state));
console.log('state changed', state);
}
});
现在,当页面刷新时,我想将保存的状态加载到应用程序中。所以我写了 getPersistedState()
并将持久状态加载到 defaultState
中。在初始加载时加载良好。
但问题是当模型设置状态道具被模型的默认数据替换时。例如,这是我的模型定义之一。
export default {
namespace: 'training',
state: {
videos: [],
current: {}
}, ....
....
所有加载的初始持久数据都将被此模型替换。那么,如何将 localstorage
值正确加载到状态中以使其保持不变?
在 dva 选项上使用 initialState
而不是 defaultState
。对于模型,将 state
设置为 null
,如果你想添加任何默认道具,也使用 initialState
。
修改代码
Dva 初始化
const app = dva({
history: createBrowserHistory(),
initialState: getPersistedState(),
onError(e) {
message.error(e.message, /* duration */3);
},
onStateChange(state){
window.localStorage.setItem('adligence', JSON.stringify(state));
console.log('state changed', state);
}
});
型号
export default {
namespace: 'training',
initialState: {
videos: [],
current: {}
},
state: null
....
....