javascript - 如何在 this.state 中使用 this.state

Question

我想将 this.state.currentPlayer 分配给 this.state.whosPlaying。它抛出错误TypeError:无法读取新板上未定义的属性“currentPlayer”。

constructor(props) {
    super(props);
    this.state = {
      symbols: [X, O],
      currentPlayer: Math.floor(Math.random() * 2),
      fields: Array(9).fill(null),
      whosPlaying: this.state.currentPlayer,
    };
  }

有人有这样的模式吗？

Answer 1

如果使用对象字面量语法，则无法在初始化期间引用对象。

如果您想根据对象中的现有属性设置状态属性，可以在 componentWillMount() 生命周期方法中执行此操作。

代码如下所示:

构造函数内部()

constructor(props) {
    super(props);
    this.state = {
      symbols: [X, O],
      currentPlayer: Math.floor(Math.random() * 2),
      fields: Array(9).fill(null)
    };
}

组件WillMount()内部

this.setState((prevState) => { whosPlaying: prevState.currentPlayer });

注意:如果您使用的是 React 16.3+，您可以考虑使用 getDerivedStateFromProps()。