在Redux应用程序中写入localStorage的位置？

我想坚持我的状态树的一些部分到localStorage。 什么是适当的地方这样做？ 减速机还是行动？

Answer 1

减速机永远不是一个合适的地方，因为减速机应该是纯净的，没有副作用。

我会build议只是在一个用户做：

store.subscribe(() => { // persist your state }) 

在创build商店之前，阅读这些持久部分：

 const persistedState = // ... const store = createStore(reducer, persistedState) 

如果你使用combineReducers()你会注意到还没有收到状态的减速器会像使用它们的默认state参数值一样“正常启动”。 这可以非常方便。

build议您删除订阅者，以免写入localStorage过快，否则会出现性能问题。

最后，您可以创build一个中间件，将其作为一种替代scheme进行封装，但是我会从订阅者开始，因为这是一个更简单的解决scheme，并且可以很好地完成这项工作。

Answer 2

要填补Dan Abramov的答案空白，你可以使用store.subscribe()像这样：

 store.subscribe(()=>{ localStorage.setItem('reduxState', JSON.stringify(store.getState())) }) 

在创build商店之前，请检查localStorage并parsing您的密钥下的任何JSON，如下所示：

 const persistedState = localStorage.getItem('reduxState') ? JSON.parse(localStorage.getItem('reduxState')) : {} 

然后，将这个peristedState常量传递给您的createStore方法，如下所示：

 const store = createStore( reducer, persistedState, /* any middleware... */ ) 

Answer 3

总之：中间件。

检查减less持续 。 或者写你自己的。

_{[更新2016年12月18日]编辑删除提及两个类似的项目，现在不活跃或不赞成。}