react.js concat error value to array state

Question

I using react to build my page

I have array['kiwi','papaya','apple']

And I using these code

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

if there is kiwi papaya apple in my array , it will concat different value to state feedbackdisplay, so after the code , I will have

this.state.feedback[0].content

this.state.feedback[1].content

this.state.feedback[2].content

in my state feedbackdisplay

but it all concat this.state.feedback[0].content to state feedback display

so I got

this.state.feedback[0].content

in my state feedbackdisplay

dostu · Accepted Answer · 2017-10-07 18:13:37Z

1

setState does not update the state immediately, so you should pass an updater function to setState if you are calling it multiple times in a row. This will ensure you are using most recent state.

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

Although making an array first and the calling setState once would be cleaner and easier to understand.

answered Oct 7, 2017 at 18:13

dostu

1,51814 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

react.js concat error value to array state

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related