Как определить, что состояние из LS (обезвоженное) соответствует форме combinereducer для применения в preloadedstate?

#reactjs #react-redux #reducers #redux-toolkit

#reactjs #react-redux #редукторы #redux-toolkit

Вопрос:

В Redux toolkit Preloadedstate (обезвоживание из localstorage) должно быть формой комбайнового редуктора, если форма неправильная или новые редукторы добавляются при последовательных обновлениях, приложение может аварийно завершиться, как сравнить форму комбайновых редукторов и форму состояния дегидратации из локального хранилища.

 import { combineReducers, configureStore, getDefaultMiddleware } from '@reduxjs/toolkit';
import { useDispatch } from 'react-redux';
import { CONFIG } from '../config/config';
import * as reducers from './models';

const reHydrateStore = () => {
    const data = localStorage.getItem(CONFIG.REDUX_APP_STATE);
    if (data) {
        return JSON.parse(data);
    }
    return undefined;
};

export const store = configureStore({
    reducer: combineReducers({ ...reducers }),
    devTools: CONFIG.ENV === 'development' ? true : false,
    middleware: getDefaultMiddleware(),
    preloadedState: reHydrateStore(), // **** heads down here *** => may crash if store shape not matches combinre reducer's sstate
});

// persisting store
store.subscribe(
    lodash.debounce(() => {
        localStorage.setItem(CONFIG.REDUX_APP_STATE, JSON.stringify(store.getState()));
    }, 1000),
);

export type RootState = ReturnType<typeof store.getState>;
export type AppDispatch = typeof store.dispatch;
export const useAppDispatch = (): ReturnType<typeof useDispatch> => useDispatch<AppDispatch>();

 

Ответ №1:

На самом деле это не зависит от redux-инструментария. Вы ищете документацию по миграции версий схемы для redux-persist.

По сути, вы, как разработчик, должны отслеживать, какие версии вашего состояния совместимы друг с другом. Эта версия будет сохранена вместе с состоянием, и вы можете ввести функции миграции для перехода от одной версии к следующей.