CODEWITHSUNDEEP
javascriptreactjs
Dheerendra
Dheerendra

Reputation: 1568

ReactJs: callback function is not called in case of this.setState

As in this fiddle http://jsfiddle.net/69z2wepo/3535/ this.setState is called in componentWillMount with callback this.loadData. But the function this.loadData is never called as callback.

Upvotes: 4

Views: 2073

Answers (1)

Jonny Buchanan
Jonny Buchanan

Reputation: 62793

I don't know how the internals work here, but looking at the docs for setState()...

...you can supply an optional callback function that is executed once setState is completed and the component is re-rendered.

...and the docs for componentWillMount()...

If you call setState within this method, render() will see the updated state and will be executed only once despite the state change.

...I assume it's related to the fact that calling setState() in render() doesn't queue up a re-render.

Given that, the most appropriate place to put an initial call to loadData would be componentDidMount(), which fires immediately after the initial render:

componentWillMount() {
  // ...
  this.setState({loaded, data});
},

componentDidMount() {
  this.loadData();
},

Upvotes: 2

Related Questions