reactjs - 为什么使用react-redux而不仅仅是redux？

Question

顶级 App 组件在构造函数方法中订阅 redux 存储:

constructor () {
  super()
  this.state = store.getState()
  store.subscribe(() => {
    this.setState(store.getState())
  })
}

它将部分状态作为 props 传递给子组件。如果某个子组件需要更新状态，它只需调度一个操作:

<button onClick={() => { 
  store.dispatch({type: 'INCREMENT'}) }
}>increment</button>

使用react-redux有什么好处？超过这个设置？换句话说，为什么我需要 react-redux ？

Answer 1

如果你的组件树不是很深，那么你是对的。优势不是很明显。然而，大多数不是简单示例的 React 应用程序很快就会有很长的树，特别是在将许多组件组合在一起时。

想象一下，你有一棵树上有一个血统

App -> HomePage -> BlogContainer -> PostList -> Post -> CustomCard -> Card -> LikeButton

和 LikeButton 组件需要访问当前选定的帖子，并希望调度一个操作来更新该帖子的点赞计数。

在您的设置中，App 和 LikeButton 之间的每个组件都需要传递该信息，即使它们从未使用过该信息。使用 react-redux 的 connect 函数，您可以直接将 LikeButton 连接到 redux 存储，并可以访问 dispatch。 YMMV，但一般来说，这是一个很好的利用模式。