Как я могу использовать this.state в this.state

Question

Я хочу присвоить this.state.currentPlayer this.state.whosPlaying.Выдает ошибку TypeError: Cannot read property 'currentPlayer' of undefined at new Board.

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

Я не думаю, что состояние реакции должно использоваться таким образом.Если вы хотите сделать это, я бы объявил currentPlayer, прежде чем вы установите состояние.Ниже приведен пример:

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

Answer 2

Нельзя ссылаться на объект во время инициализации, если вы используете литеральный синтаксис объекта.

Если вы хотите установить свойство для состояния на основе существующего свойства в объекте, вы можете сделать это в componentWillMount() метод жизненного цикла.

Код будет выглядеть следующим образом:

Внутри конструктора ()

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

Внутри componentWillMount ()

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

Примечание. Если вы используете React 16.3+, вы можете рассмотреть возможность использования getDerivedStateFromProps ().

Answer 3

Просто используйте промежуточную переменную:

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

Или просто установите ее после конца литералов объекта:

this.state = { currentPlayer: Math.floor(Math.random() * 2) };
this.state.whosPlaying = this.state.currentPlayer;