Reactjs 将异步数据推送到阵列

这是我的代码：

           if (this.state.counter===questions.length-1)
         {
            for(let i = 0 ; i < this.state.user_answer.length; i++){
              if(this.state.user_answer[i]===key[i]){
                //problem starts here
                this.setState(prevState => {return {score: prevState.score + 1}},()=>{
                  //gives me correct data for score
                  console.log("score1:",this.state.score);
                })
                }
            }
            //gives me score:0 (always)
            console.log("score2:",this.state.score);
            //i want to add correct data to my array but it adds number 0
            this.state.top_score.push([this.state.score])
         } 

if（this.state.counter===questions.length-1）
{
for（设i=0；i{return{score:prevState.score+1}}，（）=>{
//给我正确的分数数据
log（“score1:，this.state.score”）；
})
}
}
//给我分数：0（始终）
log（“score2:，this.state.score”）；
//我想向数组中添加正确的数据，但它添加了数字0
this.state.top_score.push（[this.state.score]）
} 

我想要我在

setState

中生成的数据推送到

top_score

数组中

---

我应该怎么做？

尝试在外部设置状态：

if (this.state.counter===questions.length-1)
     {
        let score = this.state.score;
        for(let i = 0 ; i < this.state.user_answer.length; i++){
          if(this.state.user_answer[i]===key[i]){

            //problem starts here
           score += 1;                
            }
        }

        console.log("score2:",score);

       this.setState({score});

        //i want to add correct data to my array but it adds number 0
        this.state.top_score.push([score])
     } 

if（this.state.counter===questions.length-1）
{
让分数=this.state.score；
for（设i=0；i

首先，尝试破坏您的状态，以便更好地使用您的状态和干净的代码，您必须在您的状态中更新数组属性，如下所示：

let {top_score , score , counter , user_answer} = this.state;

if (counter===questions.length-1)
     {
        let tempScore = score;
        for(let i = 0 ; i < user_answer.length; i++){
          if(user_answer[i]===key[i]){
           score += 1;                
            }
        }

        console.log("score2:",tempScore);
       let tempArr = [...top_score];
       tempArr.push(tempScore)
       this.setState({score : tempScore , top_score : tempArr});
     } 

让{top_score，score，counter，user_answer}=this.state；
如果（计数器===问题长度-1）
{
让tempScore=score；
for（设i=0；i

如果我正确理解了您的问题，您希望将

得分

推到

最高得分

数组中

解决方案：

     if (this.state.counter===questions.length-1)
     {
        for(let i = 0 ; i < this.state.user_answer.length; i++){
          if(this.state.user_answer[i]===key[i]){

            //problem starts here
            this.setState(prevState => {{score: prevState.score + 1}}, ()=>{

              //gives me correct data for score
              console.log("score1:",this.state.score);
              this.setState({top_score: [...this.state.top_score, this.state.score]})
            })
            }
        }

     } 

if（this.state.counter===questions.length-1）
{
for（设i=0；i{{score:prevState.score+1}}，（）=>{
//给我正确的分数数据
log（“score1:，this.state.score”）；
this.setState（{top_score:[…this.state.top_score，this.state.score]}）
})
}
}
} 

提示：在这个世界上，你永远不会回来

代码更新

上一篇：

this.state.top\u score.push（this.state.score）//这会起作用，但会直接变异状态，这在React中是不受鼓励的

当前：

---

this.setState（{top_score:[…this.state.top_score，this.state.score]}）//如果没有状态的变异

很好，您发现了javascript中最难理解的概念之一：它是异步的。关于这个主题有很多要说的，但要理解的关键是代码不一定是自上而下执行的（就像在其他语言中，例如

Python

）。相反，javascript引擎不会等待某些代码块完成执行（例如

for

循环），然后再运行接下来的其他语句。因此，在您的情况下，块：

//给我评分：0（始终）
log（“score2:，this.state.score”）；
//我想向数组中添加正确的数据，但它添加了数字0
this.state.top_score.push（[this.state.score]）

可以在上面的

for

循环完成之前执行（取决于这需要多长时间）。这在实践中意味着，在您尝试访问

score

的值后，调用

setState

，由于该值尚未更新，因此仍然是

0

。我在代码中看到的另一个关键方面是直接修改

状态的反模式。在React中，您不应该这样做，而是使用
this.setState
方法，该方法针对更新
状态进行了优化。您还可以通过使用和ES6特性来使用更具功能性的javascript方法，使代码更干净

我对您的代码的建议是：

if（this.state.counter===questions.length-1）{
const{userAnswer}=this.state；
//这将遍历数组`userAnswer'的每个元素`
userAnswer.forEach（（答案，i）=>{
如果（答案===键[i]）{
this.setState（prevState=>({
分数：prevState.score+1，
//这里使用的是数组扩展语法https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax
topScore:[…prevState.topScore，prevState.score+1]
}))
}
})
}
为什么不做
这个.state.top\u score.push（这个.state.score）
你从哪里得到分数的正确答案
如何？我尝试了
score:prevState.score+1；this.state.top_score.push（this.state.score）
我得到了错误。我在回答中提到的方法我也尝试了你的解决方案，但我得到了错误：
解析错误：意外标记，预期“，”
那是因为我代码中的}不在正确的位置。更新了我的代码。：）