【问题标题】:Is it bad practice to store a ref inside redux state?将 ref 存储在 redux 状态中是不好的做法吗?
【发布时间】:2020-09-27 22:31:23
【问题描述】:

将父 ref 存储在 redux 存储中是不好的做法吗?如果是这样,你能指出为什么吗? 我目前的任务是我有一个可滚动容器作为父组件,它有很多深层子组件,其中一些是第五级的,我需要从子组件控制这个父可滚动容器。当然可以通过children传下去,但是通过redux会方便很多。

我不觉得为此使用 redux state 是错误的,但是我看到一些人们建议不要这样做的文章,但没有明确的解释。

【问题讨论】:

    标签: reactjs redux react-redux


    【解决方案1】:

    状态应该只包含可序列化的项目,见Can I put functions, promises, or other non-serializable items in my store state?

    强烈建议您只将普通的可序列化对象、数组和原语放入存储中。

    对于你的问题,它解释了:

    技术上可以将不可序列化的项目插入到存储中,但这样做会破坏存储内容的持久化和再水化能力,并干扰时间旅行调试。

    使用redux-toolkit 你甚至会收到警告。

    Ref 对象是一个不可序列化的项目,更糟糕的是,当您卸载组件时它不会持续存在,这可能会导致未定义的行为。

    另一方面,使用上下文 API 传递 ref 是一个足够好的解决方案。虽然我会重新考虑设计并为某些层使用useImperativeHandle(将 ref 传递到第五层肯定是code smell)。

    【讨论】:

    • 感谢您的好评。这绝对有帮助!
    • 严格来说,ref对象本身是完全可序列化的。您在 refObj.current 中放置的内容可能是不可序列化的,例如 DOM 节点。
    猜你喜欢
    • 1970-01-01
    • 2011-02-14
    • 1970-01-01
    • 1970-01-01
    • 2016-10-29
    • 2017-04-25
    • 2013-11-15
    • 1970-01-01
    • 2022-10-06
    相关资源
    最近更新 更多