How can I assign an array to a state variable?

Question

I have a function that looks like this:

select(e) {
    let { selectedItems } = this.state;

    let arr: number[] = [];
    for (var i = 0; i < 2; i++) arr = [...arr, i];

    this.setState(
      {
        selectedItems: arr,
      }
    );
  console.log(selectedItems);
  }

But when I try to console.log(selectedItems), all I get is an empty array. When I console.log(arr), I get the correct output I'm looking for -- an array of length 2. What might be going on here and how can I assign selectedItems to the value of arr?

Where/when do you log? (I don't understand your sample code.) setState is async. Being an array isn't relevant; setState doesn't care about types. — Dave Newton
– Dave Newton, Commented Mar 30, 2020 at 17:30

xdeepakv · Accepted Answer · 2020-03-30 17:51:23Z

1

class A {
  select(e) {
    let { selectedItems } = this.state;
    let arr: number[] = [];
    for (var i = 0; i < 2; i++) arr = [...arr, i];
    this.setState({
      selectedItems: arr
    }, function callback() {
      console.log(this.state) // will have updated value
    });
    console.log(selectedItems); // wont print anything, coz u never assign
    selectedItems = arr;
    console.log(selectedItems); // will have updated value
  }
}

answered Mar 30, 2020 at 17:51

xdeepakv

8,1452 gold badges25 silver badges35 bronze badges

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

1 Comment

helloWorld Over a year ago

thanks, how silly of me, I just realized that this is what I was missing all along

Edgar Henriquez · Accepted Answer · 2020-03-30 19:57:10Z

1

setState takes a callback function. Try the following:

  select(e) {
    let { selectedItems } = this.state;

    let arr: number[] = [];
    for (var i = 0; i < 2; i++) arr = [...arr, i];

    this.setState({
      selectedItems: arr,
    }, function(){
        console.log(this.state);
    }.bind(this));
  }

edited Mar 30, 2020 at 19:57

Edgar Henriquez

1,3731 gold badge15 silver badges18 bronze badges

answered Mar 30, 2020 at 17:44

DCR

15.8k13 gold badges61 silver badges131 bronze badges

2 Comments

Edgar Henriquez Over a year ago

This won't work, you need to bind the this keyword to that callback function.

DCR Over a year ago

check the answer below. not binded and appears to work

Collectives™ on Stack Overflow

How can I assign an array to a state variable?

2 Answers 2

1 Comment

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Linked

Related