React 中的状态未更新 [重复]

Posted 2023-02-22

【中文标题】React 中的状态未更新 [重复]

【英文标题】：The state is not updating in React [duplicate]

【发布时间】：2020-07-20 11:14:15

【问题描述】：

我正在关注 YouTube 上关于 React 16 版测验应用程序的教程。状态和函数中有一些变量在 setState 的帮助下更新。变量的值没有被更新。更新这些变量的函数中的以下内容。正在从componentDidMount 函数调用此函数。

displayQusetions = (questions = this.state.questions, currentQuestion, nextQuestion, previousQustion) => 
   let  currentQuestionIndex  = this.state;
   if (!isEmpty(this.state.questions)) 
      questions = this.state.questions;
      currentQuestion = questions[currentQuestionIndex];
      nextQuestion = questions[currentQuestionIndex + 1];
      previousQustion = questions[currentQuestionIndex - 1];
      const answer = currentQuestion.answer;

      this.setState(
         currentQuestion,
         nextQuestion,
         previousQustion,
         answer
      )

      console.log(this.state.currentQuestion);
      console.log(this.state.nextQuestion);
      console.log(this.state.previousQustion);
      console.log(this.state.answer);
   

我是新来的反应。请帮忙。

【问题讨论】：

这个问题几乎每天都会被问到，请搜索。 React 状态更新是异步的，因此在之后记录只会产生当前渲染周期的状态，使用 setState 回调参数来记录新状态。这回答了你的问题了吗？ React setState not Updating Immediately

使用setState的第二个参数作为回调，将在状态更新后执行

这能回答你的问题吗？ React.js, wait for setState to finish before triggering a function?

【参考方案1】：

您可以在回调

中查看状态更新值

this.setState(
                currentQuestion,
                nextQuestion,
                previousQustion,
                answer
            ,()=>
            console.log(this.state.currentQuestion);
            console.log(this.state.nextQuestion);
            console.log(this.state.previousQustion);
            console.log(this.state.answer);

)