멈멈-토이프로젝트(React)1

에러 A non-serializable value was detected in an action

순9 2024. 4. 23. 22:02
728x90
A non-serializable value was detected in an action, in the path: `register`. Value: ƒ register2(key) {
    _pStore.dispatch({
      type: REGISTER,
      key
    });
  } 
Take a look at the logic that dispatched this action:  {type: 'persist/PERSIST', register: ƒ, rehydrate: ƒ} 
(See https://redux.js.org/faq/actions#why-should-type-be-a-string-or-at-least-serializable-why-should-my-action-types-be-constants) 
(To allow non-serializable values see: https://redux-toolkit.js.org/usage/usage-guide#working-with-non-serializable-data)

 

Redux가 직렬화할 수 없는 값을 포함하는 액션 객체를 처리할 때 문제가 발생할 수 있기 때문

(함수, 심볼등)

그런데 난 다 원시형자료만 사용 했는데 이게 왜 나는건지 모르겠네..

 

해결 serializableCheck

middleware: (getDefaultMiddleware) => {
    const defaultMiddleware = getDefaultMiddleware({
      serializableCheck: {
        // 직렬화 가능한지 확인할 수 있도록 대상을 설정합니다.
        ignoredActions: ["persist/PERSIST"], // redux-persist에 의해 발생하는 액션은 무시합니다.
        ignoredPaths: ["some.nested.path"], // 직렬화 검사를 건너뛸 경로를 설정합니다.
      },
    });
    return defaultMiddleware;

미들웨어를 추가하여 해당 오류가 발생하지 않는 이유는 Redux 스토어에서

액션 객체에 포함된 값이 직렬화 가능한지 검사하기 때문

미들웨어를 추가하면 개발자가 액션 객체를 생성할 때 직렬화 가능한 값을 사용하도록 유도