CODEWITHSUNDEEP
javascriptreactjsecmascript-6
Shaun
Shaun

Reputation: 471

How to make use of React setState method using getDerivedStateFromProps?

In my code, I was using componentWillReceiveProps which I know has been deprecated, but my code seems to be working fine using that method. This is what I had:

componentWillReceiveProps(nextProps) {
    if(nextProps.tableData !== undefined) {
      const data = nextProps.tableData.datapaths.map(item => { return item.row });
      this.setState({ data });
    }
  }

Can someone tell me how can I apply the same logic to the method getDerivedStateFromProps because it doesn't like and complain when I tried using setState method inside this method:

static getDerivedStateFromProps(props, state) {
    if (props.tableData !== undefined) {
      const data = props.tableData.datapaths.map(item => { return item.row });
      state.data = data;
      this.setState({ data });
    }
  }

Upvotes: 1

Views: 53

Answers (1)

Taki
Taki

Reputation: 17654

you shouldn't setState inside getDerivedStateFromProps , just return the new state :

static getDerivedStateFromProps(props, state) {
  if (props.tableData !== undefined) {
    const data = props.tableData.datapaths.map(item => { return item.row });

    // this will update the state
    return { data };
  }
}

Upvotes: 1

Related Questions