反应 - 样板节省本地状态

Question

使用https://github.com/react-boilerplate/react-boilerplate v3.4.0我想在用户点击刷新按钮时保持状态元素。
我做了什么： 在app.js我更改了 const initialState = {}; const store = configureStore(initialState, browserHistory);

为：

const initialState = loadState();
const store = configureStore(initialState, browserHistory);

其中persist.js用于持久化state.global：

export const loadState = () => {
  try {
     const serializedState = localStorage.getItem('state');
     if (serializedState === null) {
       return undefined;
     }
     return JSON.parse(serializedState);
  } catch (err) {
    return undefined;
  }
};

export const saveState = (state) => {
  try {
     const serializedState = JSON.stringify({ global: state.get('global').toJS()});
     localStorage.setItem('state', serializedState);
  } catch (err) {
     console.log(err);
  }
};

在返回商店之前的默认store.js中我添加了：

  store.subscribe(() => {
    saveState(store.getState());
  });

显然，这可以通过以后的节流来改善。

所以发生的事情是在我通过身份验证之后，状态正确地持久保存到本地存储，并且正在从本地存储中正确地重新加载。

当我在身份验证后刷新页面时，我开始跟踪store.js：

在运行createStore之前，initialstate是：

跑完后

：

  const store = createStore(
    createReducer(),
    fromJS(initialState),
    composeEnhancers(...enhancers)
 );

store.getState（）返回：

所以它所做的就是从减速器的初始状态获取值。我不明白为什么会发生这种情况，因为redux文档指出：

  

您可以选择将初始状态指定为createStore（）的第二个参数。这对于保持客户端的状态以匹配服务器上运行的Redux应用程序的状态非常有用。

所以我的问题是，如何在屏幕刷新后保持状态，为什么初始状态被reducers覆盖？

Answer 1

结果发现我的一个Reducer中有一个拼写错误 - 返回初始状态而不是默认操作的状态。