create react state name with variable reference?

Question

i want to create state like this:

componentWillReceiveProps(nextProps) {
    nextProps.columns.forEach((c) => {
      const name = nextProps.columns[nextProps.columns.indexOf(c)];
      this.setState({ `${name}`: (this.props.activeHeaders.indexOf(c) > -1) });
      console.log(`${name}`);
    });
  }

I am mapping on my array columns, so each item on the array, i want to set state on them as key, is there a possibe way?

Mayank Shukla · Accepted Answer · 2018-01-17 09:48:37Z

2

Is there a possible way?

Yes, but the way you are trying is not correct, instead of calling setState inside loop, first prepare an object with all the key-value, then pass that object to setState.

Like this:

componentWillReceiveProps(nextProps) {
    let obj = {};

    nextProps.columns.forEach((c, i) => {
        const name = nextProps.columns[nextProps.columns.indexOf(c)];
        obj[name] = this.props.activeHeaders.indexOf(c) > -1;
    });

    this.setState(obj);
}

Didn't get the meaning of this line:

const name = nextProps.columns[nextProps.columns.indexOf(c)];

edited Jan 17, 2018 at 9:48

answered Jan 17, 2018 at 9:39

Mayank Shukla

105k19 gold badges163 silver badges146 bronze badges

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

1 Comment

gpbaculio Over a year ago

Thanks a lot. it worked. this is a good way to achieve what i wanted to do

simbathesailor · Accepted Answer · 2018-01-17 09:37:10Z

2

componentWillReceiveProps(nextProps) {
    nextProps.columns.forEach((c) => {
      const name = nextProps.columns[nextProps.columns.indexOf(c)];
      this.setState({ [name]: (this.props.activeHeaders.indexOf(c) > -1) });
      console.log(`${name}`);
    });
  }

This should do the job

answered Jan 17, 2018 at 9:37

simbathesailor

3,6852 gold badges22 silver badges30 bronze badges

2 Comments

gpbaculio Over a year ago

hmm, is that an array? [name]?

simbathesailor Over a year ago

stackoverflow.com/questions/19837916/… read this this is how you can add dynamic keys to object in es6

Collectives™ on Stack Overflow

create react state name with variable reference?

2 Answers 2

1 Comment

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related