CODEWITHSUNDEEP
javascriptreactjs
gpbaculio
gpbaculio

Reputation: 5968

create react state name with variable reference?

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?

Upvotes: 2

Views: 1217

Answers (2)

Mayank Shukla
Mayank Shukla

Reputation: 104369

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

Upvotes: 2

simbathesailor
simbathesailor

Reputation: 3687

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

Upvotes: 2

Related Questions