看来您正在尝试在多页上下文中使用单页应用程序框架。为了使两者更好地配合使用，您可以研究制作自己的中间件，该中间件使状态之间来回同步，
localStorage以创建在刷新/页面导航后似乎没有丢失任何状态的应用程序。
- 与redux-logger记录前一个状态和下一个状态的方式类似，我可能会从在函数创建的开始（
localStorageLoad
）和结束（localStorageDump
）createStoreWithMiddleware
（恰好在redux-logger
）之前插入中间件开始：
// store/configureStore.js const createStoreWithMiddleware = applyMiddleware( localStorageLoad, thunk, promise, localStorageDump, logger )(createStore);
- 然后，当您初始化应用以在应用呈现之前加载存储状态时，立即触发初始操作：
// index.js const store = configureStore(); store.dispatch({ type: 'INIT' }); ReactDOM.render(<App />, document.getElementById('root'));该
localStorageLoad会处理的
INIT行动，并派遣某种
SET_STATE行动，其中将包含与先前保存在状态的有效载荷
localStorage。
// middleware/localStorageLoad.js export default store => next => action => { const { type } = action; if (type === 'INIT') { try { const storedState = JSON.parse( localStorage.getItem('YOUR_APP_NAME') ); if (storedState) { store.dispatch({ type: 'RESET_STATE', payload: storedState }); } return; } catch (e) { // Unable to load or parse stored state, proceed as usual } } next(action); }然后，添加一个reducer，用该负载替换状态，从而像以前一样有效地重新启动应用程序。
- 要完成循环，您需要
localStorageDump
在链的末尾提供一个中间件，该中间件将每个简化状态的对象保存到中localStorage
。像这样：
// middleware/localStorageDump.js export default store => next => action => { const state = store.getState(); localStorage.setItem('YOUR_APP_NAME', JSON.stringify(state)); next(action); }只是一个想法，实际上还没有尝试过。希望能帮助您开始寻求解决方案。
