redux persist 다수의 store생성법

이무헌·2022년 9월 29일
0

redux-persist&toolkit

목록 보기
1/1

오늘 redux toolkit에 새로운 전역변수를 하나 생성 할 일이 생겼다.
평소처럼 redux-persist를 사용하여 진행하려 했는데 이상한일이 생겼다.
분명히 reducer는 두개인데 값을 각각 저장 할 때 마다

persist:root

요 값이 바뀌지 persist저장소가 local에 따로 생성되지 않는것이다.
1시간정도 머리 싸매다가 머리털 조금 빠지고 깨달았다.

const persistConfig = {
    key: 'root',
    version: 1,
    storage,
  }

요놈, 누가봐도 key:root에 저장소 설정값을 내포하고 있는 요놈... 요놈을 건들였다.

const teacherPersistConfig = {
  key: "teacher",
  version: 1,
  storage,
};
const studentPersistConfig = {
  key: "student",
  version: 1,
  storage,
};

키 값을 바꿨고, 곧 바로 persist-reducer를 새로운 변수에 각각 할당 했다.

const persistTeacherReducer = persistReducer(teacherPersistConfig, userReducer);
const persistStudentReducer = persistReducer(
  studentPersistConfig,
  studentReducer
);

그 후 평소처럼 store에 몰아서 저장

export const store = configureStore({
 reducer: {
   teacherUid: persistTeacherReducer,
   studentInformation: persistStudentReducer,
 },
 middleware: (getDefaultMiddleware) =>
   getDefaultMiddleware({
     serializableCheck: {
       ignoredActions: [FLUSH, REHYDRATE, PAUSE, PERSIST, PURGE, REGISTER],
     },
   }),
});

개발자 도구 로컬저장소로 들어가면 정상적으로 각 key에 맞게 value가 들어 간 것을 알 수 있다.

profile
개발당시에 직면한 이슈를 정리하는 곳

0개의 댓글