DvaJS - 将保存的状态从 localStorage 加载到状态中答案

【问题标题】：DvaJS - Load saved state from localStorage into stateDvaJS - 将保存的状态从 localStorage 加载到状态中
【发布时间】：2018-10-22 19:06:15
【问题描述】：

我启动了我的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 值正确加载到状态中以使其保持不变？

【问题讨论】：

标签： javascript reactjs dvajs

【解决方案1】：

在 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
     ....
    ....

【讨论】：