Question

我使用react来构建我的页面

我有阵列[＆＃39; kiwi＆＃39;，＆＃39;木瓜＆＃39;，＆＃39; apple＆＃39;]

我使用这些代码

  if(this.state.recordFood.indexOf('kiwi') !=-1){
  this.setState({
    feedbackDisplay: [...this.state.feedbackDisplay,this.state.feedback[0].content]
  })
};
if(this.state.recordFood.indexOf('papaya') !=-1){
  this.setState({
    feedbackDisplay: [...this.state.feedbackDisplay,this.state.feedback[1].content]
  })
};
if(this.state.recordFood.indexOf('apple') !=-1){
  this.setState({
    feedbackDisplay: [...this.state.feedbackDisplay,this.state.feedback[2].content]
  })
};

如果我的阵列中有奇异果木瓜苹果，它会将不同的值连接到状态feedbackdisplay，所以在代码之后，我会有

this.state.feedback [0]。内容

this.state.feedback [1]。内容

this.state.feedback [2]。内容

在我的状态feedbackdisplay中

但是这一切都将this.state.feedback [0] .content连接到状态反馈显示

所以我得到了

this.state.feedback [0]。内容

在我的状态feedbackdisplay中

Answer 1

setState不会立即更新状态，因此如果您连续多次调用它，则应将更新程序功能传递给setState。这将确保您使用最近的状态。

this.setState((prevState, props) => ({ feedbackDisplay: [...prevState.feedbackDisplay, this.state.feedback[1].content] }));

虽然先制作一个数组，然后调用一次setState会更干净，更容易理解。

react.js将错误值连接到数组状态

1 个答案: