Как сохранить store redux в localstorage

370
15 января 2018, 10:28

Добрый день, подскажите, как добавить store redux в localstorage (на данный момент обнуляется при перезагрузке): store:

     function configureStore(initialState) {
let createStoreWithMiddleware;
const middleware = process.env.__DEV__
    ? applyMiddleware(thunk, createLogger())
    : applyMiddleware(thunk);
createStoreWithMiddleware = compose(
    middleware,
);
const store = createStoreWithMiddleware(createStore, loadState())(rootReducer, initialState);
if (module.hot) {
    module.hot
        .accept('../reducer', () => {
            const nextRootReducer = require('../reducer/index');
            store.replaceReducer(nextRootReducer);
        });
}

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

} export default configureStore

Answer 1

В первом приближении кажется так. Пишем middleware и подключаем. Но в целом я бы посмотрел в сторону redux-persist, redux-offline или других отработанных решений, так как тут как всегда много подводных камней

Кстати в вашем коде несколько непонятно как подключается middleware, зачем там compose, если в нём только одна функция. Если некие middleware нужно фильтровать, вот вариант как это сделать может быть несколько более элегантно. Также советую переименовать __DEV__ обратно в NODE_ENV, так как библиотеки (react), а также утилиты (npm, yarn, webpack) ожидают NODE_ENV=production при продакш сборке.

const persistMiddleware = ({ getState(), dispatch }) => next => action => {
    const result = next(action);
    localStorage.set('my-state', JSON.stringify(getState());
    return result;
}
const middleware = [
    thunk,
    process.env.__DEV__&& createLogger,
    persistMiddleware,
].Boolean();
const initialState = localStorage.getItem('my-state') || {};
const store = createStore(rootReducer, initialState, applyMiddleware(...middleware));
READ ALSO
Написание тела метода в одну строчку javaScript [требует правки]

Написание тела метода в одну строчку javaScript [требует правки]

Как написать тело метода в одну строчку используя ';' ТОЛЬКО ОДИН РАЗ, если в коде несколько операций?

304
не работает pjax form

не работает pjax form

Здравствуйте, проблема такая сайт без фрэмворков на чистом php и на хостинге не vps , на сайте есть pjax по ссылкам переходит без перезагрузки страниц,...

399
Плавная прокрутка к якорям JS

Плавная прокрутка к якорям JS

Можно ли реализовать плавную прокрутку к якорям на нативном JS?

354