javascript - 使用 localStorage 数据更新 reducer 初始状态是一个好习惯吗？

Question

我有一个具有初始状态的 reducer ，并且工作正常。

const initialState = [items:{
    id: 1,
    text: 'Monday',
},
{   id: 1,
    text: 'Tuesday',
}];

function dayChaged(state = initialState, change) {

..
}

我的应用程序运行良好。不过，我添加了对本地存储的支持。每当用户添加一项时，我想将新项目存储在存储中。当页面刷新/重新加载时，我想将 iniTialState 设置为 iniTialState 的值加上 localstorage 值。目前我在状态/ reducer 类中添加了这个，但是，我觉得这不是最佳实践。

const storageItems = JSON.parse(localStorage.getItem('items'));
if(storageItems) {
    initialState = { todos: initialState.items.concat(storageItems) };
} 
 function dayChaged(state = initialState, change) {

    ..
    }

它工作正常并且做我想做的事。然而，根据我的理解，这使 reducer 变得复杂。请问我应该在哪里添加这样的功能并考虑到我的意图，我如何在不影响状态可测试性的情况下完全集成它？

Answer 1

首先考虑您是否确实需要更改 reducer 的初始状态，或者您实际上需要的是设置整个存储的初始状态(在这种情况下，各个 reducer 的初始状态将被忽略)。

查看 createStore 函数的签名，它接受初始存储状态作为第二个(可选)参数，从 localStorage 传递您的状态，您应该是黄金。

https://github.com/reactjs/redux/blob/master/docs/api/createStore.md