Как обновить реагирующую переменную состояния?

Question

Я пытаюсь обновить состояние переменной «selectedPlayer», однако, когда я устанавливаю функцию setState, состояние этой переменной не обновляется, я проверил это через консольные журналы, как вы можете видеть ниже.

Ниже показано, как я пытаюсь установить состояние переменной и некоторых из этого файла класса для вашего знания.

 this.setState({ selectPlayer: player });

Это часть файла компонента и функция, которую яиспользую для обновления состояния.

  class StatApp extends Component {
      constructor(props) {
        super(props);
        this.state = {

          selectedPlayer: 'dassdasda',

        };
        this.selectPlayer = this.selectPlayer.bind(this);
      }

    selectPlayer = e => {
        e.preventDefault();
        //  console.log(e.target.value); //will give you the value continue

        // Store Value
        const selectPlayer = this.state.selectedPlayer;
        console.log(this.state.selectedPlayer);

        console.log(selectPlayer);

        // Test to see if we are getting the value from the playerButton 
        const player = e.target.value;
        console.log(player);


        this.setState({ selectPlayer: player });

        console.log(selectPlayer);

      };

Answer 1

setState является асинхронным, поэтому, когда вы регистрируете консоль, состояние еще не обновлено. Вы можете использовать форму обратного вызова setState, чтобы получить обновленное состояние:

this.setState(
    { selectPlayer: player },
    () => console.log(this.state.selectPlayer)
);

Answer 2

Полагаю, это опечатка. попробуйте изменить

 this.setState({ selectPlayer: player });

на

this.setState({ selectedPlayer: player });

Найти другой ответ для обновленного состояния, которое не выводится на консоль .