如何根据 Redux 状态更改制作 React 组件 setState()？

Question

我认为我知道这个问题的答案，但只是为了确定：

我希望 React 组件在 Redux 状态更改为特定条件（例如，state.dataLoaded === true）时调用 this.setState()。我应该以某种方式使用 subscribe，还是级别太低而我应该使用 connect 将状态映射到道具？在这种情况下，我认为这样的事情是可以接受的：

componentWillReceiveProps(nextProps) {
  if (nextProps.dataLoaded) {
    this.setState({
      dataSource: this.state.dataSource.cloneWithRows(nextProps.posts)
    });
  }
}

Answer 1

您绝对应该使用 connect 来执行此操作。当 redux 的状态发生变化时，将生成新的 props 并触发 componentWillReceiveProps.

class MyComp extends React.Component {
  componentWillReceiveProps(nextProps) {
    if (nextProps.dataLoaded) {
      this.setState({
        dataSource: this.state.dataSource.cloneWithRows(nextProps.posts)
      })
    }
  }
}

export default connect(
  state => ({
    dataLoaded: state.someStore.loaded
  })
)(MyComp)

如何根据 Redux 状态更改制作 React 组件 setState()？

How to make a React component setState() based on a Redux state change?

reactjs

redux