【问题标题】:why is mapStateToProps/mapDispatchToProps defined in every file?为什么每个文件中都定义了 mapStateToProps/mapDispatchToProps?
【发布时间】:2018-07-12 08:48:26
【问题描述】:

人们似乎总是在他们需要的每个组件的底部定义这些功能是有原因的吗?

当我创建一个 react/redux 项目时,我将它们放在 /mappingFunctions 目录中,然后将它们导入到我需要它们的文件中,从而只声明一次函数。显然意味着这些功能包含的不仅仅是必要的,但这意味着它们只在一个地方而不是定义它们一百万次。

只是想知道为什么这不是标准?

【问题讨论】:

    标签: javascript reactjs redux


    【解决方案1】:

    每个组件/容器可能需要从 redux 存储访问不同的变量集和不同的操作集。所以 mapStateToProps 和 mapDispatchToProps 是为所有需要与 Redux 存储交互的组件单独定义的。

    您也不需要为每个组件使用 mapStateToProps、maDispatchToProps。您可以在传递 props 或将每个组件连接到 Redux 存储之间取得平衡。

    查看Use Connect or pass data as props to children了解更多详情

    【讨论】:

    • 是的,我明白了,但我的意思是对于每个连接的组件,最好只有一个事实来源并从远程位置调用该函数。这样你就可以访问它,而不是到处重新定义它。也许我说的没有道理。很好地将它定义在一个地方而不是像 5000 次
    • @donut,将其定义在单个位置或单个文件中取决于偏好。就我个人而言,如果它在同一个文件中,我觉得它更具可读性。还有一些人将容器与组件分开,您只需导入和导出连接的组件。但是您不会连接 5000 个不同的组件来存储。
    【解决方案2】:

    因为传递给组件的状态和动作通常是不同的

    【讨论】:

      【解决方案3】:
      • mapStateToProps - 这是 Redux 在更新某些状态时调用的回调。它用于更新 Map Redux 存储对组件属性的更改。您的每个组件很可能对 Redux 存储状态的不同部分感兴趣。如果您的容器组件不需要根据 Redux 存储状态更新进行更新,则无需实现此功能。
      • maDispatchToProps - 这是用于创建通过调度连接到 redux 的操作闭包的回调。这样,Redux 存储就可以知道由您的组件触发的操作,并可以相应地更新其状态。您的容器组件将只使用少数操作。容器组件可能不需要连接任何操作,因此您不需要实现它。

      如果您发现自己在各种容器组件中重复了相同的 mapStateToProps/maDispatchToProps,您可能应该在应用的不同位置重用相同的容器组件,并以这种方式删除此类代码重复。

      【讨论】:

        猜你喜欢
        • 2018-06-15
        • 2018-05-10
        • 2017-05-03
        • 2021-01-05
        • 1970-01-01
        • 2019-03-01
        • 2018-10-04
        • 2021-03-29
        • 2019-07-22
        相关资源
        最近更新 更多