Redux：我应该在哪里调用 mapDispatchtoProps？

Question

我有一个父组件 (ProfileScreen)。该组件由 ProfilePhoto、ProfileInfo 等较小的子组件组成。从子组件 ProfilePhoto 和 ProfileInfo 我可以编辑有关用户的信息 - 他们的个人资料照片，他们的用户名，等等。在我编辑了一些用户的数据之后，我想调用 fetchUser - 这是 redux 的一个方法，它从数据库中获取当前用户。也就是说，在我编辑用户之后，我再次从数据库中获取它，所以我的组件会刷新，我可以在 ProfileScreen 上看到更新的更改。目前，我的结构如下：在 ProfileScreen 里面我调用

const mapDispatchProps = (dispatch) =>
  bindActionCreators({ fetchUser }, dispatch)

然后我将 fetchUser 作为属性传递给 ProfileScreen 和 ProfileInfo。这样当用户完成配置文件编辑时，我可以调用 fechUser 并重新加载组件。

我的问题是 - 这是这样做的正确方法吗？叫

不是更好吗

const mapDispatchProps = (dispatch) =>
      bindActionCreators({ fetchUser }, dispatch)

直接来自子组件（ProfilePhoto 和 ProfileInfo），而不是将其作为属性?

传递

Answer 1

这个问题要看具体情况。没有正确的答案。但是对于你的情况，我推荐前者。

使 ProfileScreen 组件成为容器组件。它是有状态的和不纯的。这意味着我们使用 mapDispatchProps 将 dispatch 和 action creator 注入到 props 中。处理容器组件中的副作用，例如 DOM 操作、网络 I/O、清理工作。

制作 ProfilePhoto 和 ProfileInfo 组件展示组件。他们是纯粹的、无国籍的。这意味着它们不应该包含任何副作用代码。只需接受父级的道具并渲染即可。

     ProfileScreen(container)
     /           \
ProfilePhoto  ProfileInfo

如果 ProfilePhoto 组件将来变得更复杂，请考虑将其用作容器组件。它的子组件然后用作表示组件。

但请记住，结合更多有状态和非纯组件会导致代码复杂性增加。

进一步阅读：Presentational and Container Components

Redux：我应该在哪里调用 mapDispatchtoProps？

Redux: where should I call mapDispatchProps?

reactjs

react-native

redux

react-redux