Примечание. Первоначально он был написан на португальском языке и переведен Google

Эта библиотека позволяет отслеживать статус приложения (Redux store) и реплицировать в localStorage (браузер), что позволяет перезагрузить страницу без потери состояния.

  • Первый шаг - импортировать библиотеку и сообщить в store
import {createStore, combineReducers} from 'redux'
import storeSynchronize from 'redux-localstore'
import {Reducer1, Reducer2} from './modules'
const combineReducer = combineReducers({
  Reducer1,
  Reducer2
})

export const store = createStore(combineReducer)

storeSynchronize(store)

Только выделенные жирным шрифтом линии все состояние вашего приложения будет реплицировано в localStorage браузера. Остальные строки - это настройки по умолчанию для приложения Redux.

  • На втором этапе вам необходимо настроить редукторы так, чтобы они собирали эти данные из localStorage при запуске / перезагрузке приложения.
import {defineState} from 'redux-localstore'

const defaultState = {
  data: null
}

const initialState = defineState(defaultState)('Reducer1')

export default (state = initialState, action) => {
  switch (action.type) {
    case 'ACTION1':
      return {
        ...state,
        data: action.payload
      }
    case 'ACTION2':
      return {
        ...state,
        data: null
      }
    default:
      return state
  }
}

Метод defineState проверяет, есть ли у него что-то в localStorage, если есть, он использует это как начальное состояние ... В противном случае он использует значение по умолчанию состояние установлено. Очень просто, не правда ли?

Единственная деталь, которую следует отметить, - это то, что имя, переданное в качестве второго аргумента в defineState, является именем Reducer, используемого в combReducers.

Настройки в основном таковы, и вы можете найти библиотеку по адресу: https://github.com/arojunior/redux-localstore