Question

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

下面是我如何设置变量的状态以及此类文件的一些信息

 this.setState({ selectPlayer: player });

这是一些Component文件和一个我正在用来更新状态的函数。

  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 });

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

如何更新反应变量状态？

2 个答案: