首页 > 解决方案 > 在 Redux 存储中存储不可序列化的数据项的实际风险是什么?

问题描述

每当我在 Redux 存储中存储不可序列化的值时,都会收到以下警告:

在以下示例中,我将 a 存储Firestore.Timestamp在 Redux 状态。它也发生在Date对象上。

在状态中检测到一个不可序列化的值,在路径中:blogPost.createdAt。值:t {秒:1583488258,纳秒:805000000}

查看处理此操作类型的 reducer:LOAD_BLOGPOST_SUCCESS。(参见https://redux.js.org/faq/organizing-state#can-i-put-functions-promises-or-other-non-serializable-items-in-my-store-state

这就是文档所说的:

https://redux.js.org/faq/organizing-state#can-i-put-functions-promises-or-other-non-serializable-items-in-my-store-state

我可以将函数、承诺或其他不可序列化的项目放入我的 store 状态吗?

强烈建议您只将普通的可序列化对象、数组和原语放入您的存储中。在技​​术上可以将不可序列化的项目插入到 store 中,但这样做会破坏持久化和重新水化 store 内容的能力,并干扰时间旅行调试。

如果您对持久性和时间旅行调试等可能无法按预期工作的事情感到满意,那么完全欢迎您将不可序列化的项目放入您的 Redux 存储中。最终,它是您的应用程序,您如何实现它取决于您。与有关 Redux 的许多其他事情一样,请确保您了解所涉及的权衡。

我对上面的文档摘录不太了解。我觉得有点模糊。任何人都可以更详细地解释通过向 Redux 状态添加不可序列化数据我们可能/将会丢失什么?

不同数据类型的结果是否不同?例如: a Promise, afunction (ex: a React component)和 aDate会导致不同的问题吗?它肯定会引起问题吗?或者它可能会或可能不会发生?

持久保存和补充商店内容的能力是什么意思?这是否意味着它可能会破坏我的应用程序代码,或者我们只是在谈论 devtools 调试?


更新

刚刚从 Redux Toolkit 中找到了另一篇文档:Working With Non-Serializable Data

使用不可序列化的数据

Redux 的核心使用原则之一是您不应该将不可序列化的值放入状态或操作中。

但是,与大多数规则一样,也有例外。有时您必须处理需要接受不可序列化数据的操作。这应该很少并且仅在必要时才这样做,并且这些不可序列化的有效负载不应该通过减速器进入您的应用程序状态。

可序列化开发检查中间件会在检测到您的操作或状态中的不可序列化值时自动发出警告。我们鼓励您保持此中间件处于活动状态,以帮助避免意外出错。但是,如果您确实需要关闭这些警告,您可以通过将中间件配置为忽略特定的操作类型或操作和状态中的字段来自定义中间件:

似乎本节教你如何忽略在操作中使用不可序列化值的警告,但它也说它不应该进入状态,对吧?

标签: javascriptserializationreduxredux-toolkitredux-devtools

解决方案


持久保存和补充商店内容的能力是什么意思?这是否意味着它可能会破坏我的应用程序代码,或者我们只是在谈论 devtools 调试?

可序列化数据,意味着您将数据转换为文本表示,然后将其从文本表示重新加载为实际类型;

保持和补充商店内容的能力意味着

持久化和再水化应用程序是一种用于存储当前应用程序商店状态的技术,以便在以后重新加载。假设您的用户正在处理一些复杂的表单,当他关闭浏览器并重新打开它时,您希望表单填充用户在他上次会话中输入的内容,但没有将数据存储在后端服务器中。所以当网页关闭时你会保留你的反应商店,并在用户重新打开网页时重新加载它(从 locastorage 重新水化)

实际发生的情况是,当您想从之前保存的数据中水合您的应用程序状态时,非可序列化字段将不会被解析并转换为正确的类型(即使不可序列化有时也可以工作)

因此,如果您不打算持久化和重新水化状态,您可以忽略该消息,但您也可以为您的类型实现自定义序列化程序(例如将时间戳转换为字符串)


推荐阅读