Inserting values inside an array which is in an State - React

Question

I have an array inside an state which is an associative array. I want to insert values into this array when an event occurs.

State Declaration I used.

state = {
    array: [{
        aaa: '',
        bbb: ''
    }]
};

Function which is supposed to insert values to the array inside state.

reader.onload = (e) => {

    var newArray = {
        aaa: new_aaa,
        bbb: new_bbb
    }
    this.setState({
        array: this.state.array.concat(newArray)
    });

}

Somehow , it isn't working ^_^

Have you tried with given answers? If yes then please do upvote and accept the answer. Thanks — Hemadri Dasari
– Hemadri Dasari, Commented Oct 27, 2018 at 5:51

Narendra Jadhav · Accepted Answer · 2018-10-26 07:32:59Z

1

You could use Destructuring_assignment when you are setting your state.

state = {
  array: [{
    aaa: '',
    bbb: ''
  }]
};

reader.onload = (e) => {
  var newArray = {
    aaa: new_aaa,
    bbb: new_bbb
  }
  this.setState({
    array: [...this.state.array,newArray]
  });
}

answered Oct 26, 2018 at 7:32

Narendra Jadhav

10.3k15 gold badges35 silver badges45 bronze badges

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

Comments

Hemadri Dasari · Accepted Answer · 2018-10-26 07:31:30Z

1

Try with below code. The best approach to push values or object to an array in React is using previous state like below

  reader.onload = (e) => {
       const obj = {
           aaa: new_aaa,
           bbb: new_bbb
        }
       this.setState( prevState => ({
              array: [...prevState.array, obj]
        }));
   }

Or

   reader.onload = (e) => {
       const obj = {
           aaa: new_aaa,
           bbb: new_bbb
        }
       const array = [...this.state.array];
       array.push(obj);
       this.setState({
              array
        });
   }

answered Oct 26, 2018 at 7:31

Hemadri Dasari

34.2k41 gold badges125 silver badges166 bronze badges

Collectives™ on Stack Overflow

Inserting values inside an array which is in an State - React

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related