Search code examples
react-nativemiddlewareredux-toolkit

How To Set serializableCheck: false For Specific Slice ReduxToolKit React Native


I cannot find a way to set serializableCheck to false only for specific slice.

const store = configureStore({
  reducer: {    
    ApiSignalMenu: ApiSignalMenuSlice.reducer,
    ApiSignalData: ApiSignalDataSlice.reducer,
    ApiHistoricalMenu: ApiHistoricalMenuSlice.reducer,
    ApiHistoricalYearData: ApiHistoricalYearDataSlice.reducer,
    ApiUpProbabilityMenu: ApiUpProbabilityMenuSlice.reducer,    
    ApiUpProbabilityData: ApiUpProbabilityDataSlice.reducer,
    ApiMoverData: ApiMoverDataSlice.reducer,
    ApiChartingMenu: ApiChartingMenuSlice.reducer,    
    ApiChartingData: ApiChartingDataSlice.reducer,
    ApiTicker: ApiTickerSlice.reducer    
  },
  // middleware: (getDefaultMiddleware) =>
  //   getDefaultMiddleware({      
  //     serializableCheck: false
  //   }
  middleware: (getDefaultMiddleware) => getDefaultMiddleware({
    serializableCheck: {
      ignoredPaths: ['ApiMoverData.apiData.0'],      
    }
  }) 
});

I have array data in : ApiMoverData

If I set : ignoredPaths: ['ApiMoverData.apiData.0'],

Then I got error again for A non-serializable value was detected in an action, in the path: payload.0. Value:, ApiMoverData

And

Then I got error again for Then I got error again for A non-serializable value was detected in the state, in the path: ApiMoverData.apiData.0

ApiMoverData.apiData.1, Then ApiMoverData.apiData.2, again.

How to set serializableCheck to false to all my array data in specific slice ?

This post : Is there a way to set the serializableCheck to false for one reducer only in redux?

did not tell a specific answer.

Thank You

EDIT :

My structure data looks like this :

Array [
  ApiMoverData {
    "change": "1,43",
    "company": "Garuda Maintenance Facility Aero Asia Tbk.",
    "id": 0,
    "last": "71",
    "ticker": "GMFI",
    "value": "99.343.200",
    "volume": "13.992",
  },
  ApiMoverData {
    "change": "1,44",
    "company": "Kimia Farma Tbk.",
    "id": 1,
    "last": "1.765",
    "ticker": "KAEF",
    "value": "956.208.000",
    "volume": "5.433",
  }
]

If I set : ignoredPaths: ['ApiMoverData.apiData']

Then I got error again for A non-serializable value was detected in an action, in the path: payload.0. Value:, ApiMoverData

And

Then I got error again for A non-serializable value was detected in the state, in the path: ApiMoverData.apiData.0

ApiMoverData.apiData.1, Then ApiMoverData.apiData.2, again.

Same Error


Solution

  • recomended by @phry do not use class instance in redux-toolkit. Because it will effect negative in future. Also we will not be able to use Redux-Persist. Just use non-class javascript object and store that.