如何更新反应变量状态？

Question

我正在尝试更新变量的状态 "selectedPlayer" 但是当我使用 setState 函数时该变量的状态没有更新，我已经通过控制台日志对此进行了测试，如下所示。

下面是我如何尝试设置变量的状态以及此 class 文件中的一些内容以供您了解

 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

我想这是一个打字错误。尝试改变

 this.setState({ selectPlayer: player });

至

this.setState({ selectedPlayer: player });

找到未在控制台上打印更新状态的其他答案。

Answer 2

setState 是异步的，因此当您在控制台记录它时，状态尚未更新。您可以使用 setState 的回调形式来获取更新状态：

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

如何更新反应变量状态？

How to update react variable state?

reactjs

react-state-management