如何克服“不可序列化值检测”

问题描述 投票:0回答:3

我正在使用 redux-toolkit 实现 React 应用程序,从 firestore 获取数据时出现此类错误。

在操作中检测到不可序列化的值,路径为:

payload.0.timestamps.registeredAt

在操作中检测到不可序列化的值,路径为:

payload.0.profile.location

前者的数据类型是firebase.firestore.Timestamp,后者是GeoPoint
我认为两者都可能无法序列化,但我想获取这些数据并将其显示给用户。
我怎样才能克服这些错误?
根据这个问题,我可能会这样写;

const store = configureStore({
 reducer: rootReducer,
 middleware: [
  ...getDefaultMiddleware({
  serializableCheck: {
     ignoredActionPaths: ['meta.arg', 'meta.timestamp'], // replace the left to my path
     },
  }),
  reduxWebsocketMiddleware,
 // ... your other middleware
],
});

但我不确定它是否安全,即使安全,我也不知道如何动态编写路径,因为我的有效负载是数组。


如果有人提供一些线索,我将非常感激。

firebase redux google-cloud-firestore redux-toolkit redux-middleware
3个回答
11
投票

查看

使用 redux 工具包时出现错误“在状态中检测到不可序列化的值” - 但使用普通 redux 时则不然

根据 Rahad Rahman 的回答,我在 store.ts 中执行了以下操作:

export default configureStore({
    reducer: {
        counter: counterReducer,
        searchShoes: searchShoesReducer,
    },    
    middleware: (getDefaultMiddleware) => getDefaultMiddleware({
        serializableCheck: false
    }),
});

3
投票

解决此问题的最佳方法是将数据转换为可序列化的数据,以便您可以安全地存储在您的状态中。 根据样式指南,您不应将不可序列化的值放入状态或操作中

这样做的一个好地方是在减速器

prepare
函数中。


0
投票

谢谢,我正在寻找解决方案。 ChatGPT 和 Gemini 都没有帮助我以及这个帖子中的答案!

这个解决方案对我有用: 导出默认configureStore({ 减速器:{ 计数器:counterReducer, 搜索鞋子:搜索鞋子减速器, }, 中间件:(getDefaultMiddleware)=> getDefaultMiddleware({ 可序列化检查: false }), });

© www.soinside.com 2019 - 2024. All rights reserved.