Meant as an alternative to redux-persist, providing a selector based API, while remaining compatible with its persistors ecosystem.
Install the package using:
# npm package
$ npm install --save redux-persistent
Simple demo:
import { createStore, applyMiddleware } from 'redux';
import persistent, { hydrate } from 'redux-persistent';
import { setUsername } from './actions';
const store = createStore(reducer, initialState, applyMiddleware(
persistent({
username: { // persists the result of getUsername(state) inside the provided storage, under the keye 'username'
selector: getUsername,
load: (username, ({ dispatch })) => dispatch(setUsername(username)),
},
}, {
storage: localStorage, // optional, defaults to localStorage, also tested with redux-persist-node-storage
}),
))
store.dispatch(hydrate());This module relies on ES6 Symbol, so it needs to be polyfilled in environments where it is not supported. For example:
import 'core-js/features/symbol';
Or if using rollup, you can use rollup-plugin-polyfill.
The default export of this module, and the redux middleware. Accepts the following arguments:
Type: Object, required
Key-value pair. The key will be used to store the item inside the provided storage, while the value is an object with the shape { selector: (state) => any, load: (value, store) => void }. The selector defines the value to store, and load defines how to restore the value into the redux store.
const selectors = {
[key]: {
selector: (state: Object) => any, // serializable
load: (value: any, { dispatch, getState }) => void,
},
};A redux-persist compatible storage. It is an object of the shape:
const storage = {
getItem: (key: String) => Promise<any> | any,
setItem: (key: String, value: any) => Promise<void> | void,
removeItem: (key: String) => Promise<void> | void,
};By default, const storage = localStorage.
An action creater to load the stored state into the redux store.
An action creator to remove a stored item from the provided storage.
See the LICENSE file for license rights and limitations (MIT).