添加持久性以响应 redux 不可变 Web 应用程序

Question

我正在尝试向我的 redux 商店添加持久性，我在我的 web 应用程序中使用 Immutable.js。我看过以下库：https://github.com/rt2zz/redux-persist 和 https://github.com/rt2zz/redux-persist-immutable 我想知道如何在我的应用程序的上下文中创建持久性和存储，请参阅以下config-store.js：

import rootReducer from '../reducers'
import {
  createStore,
  compose,
  applyMiddleware
} from 'redux'
import thunk from 'redux-thunk'

export default (initialState) => {
  return createStore(
    rootReducer,
    initialState,
    compose(
      applyMiddleware(thunk),
      window.devToolsExtension ? window.devToolsExtension() : f => f
    )
  );
};

还有我的index.js：

import React from 'react';
import {render} from 'react-dom';
import './index.css';
import App from './App';
import {Provider} from 'react-redux';
import configureStore from './store/configure-store';
import registerServiceWorker from './registerServiceWorker';

const store = configureStore();

render(
   <Provider store={store}>
     <App />
   </Provider>,
  document.getElementById('root')
)
registerServiceWorker();

Answer 1

从本地存储中加载持久状态。

if (localStorage.getItem("state")) {
  var serializedState = localStorage.getItem("state");
  /* upload changes to server here */
  preloadedState = JSON.parse(serializedState);
}

将存储更改保存到本地存储。

store.subscribe(() => {
  var serializedState = JSON.stringify(store.getState());
  localStorage.setItem("state", serializedState);
});