Browse Source

Updated the ajax to tip to also mention that you need to check

that the component is still mounted before updating it's state.

Closes #1600.
main
Tom Haggie 11 years ago
committed by Ben Alpert
parent
commit
599ea5e51e
  1. 12
      tips/12-initial-ajax.md

12
tips/12-initial-ajax.md

@ -9,6 +9,8 @@ next: false-in-jsx.html
Fetch data in `componentDidMount`. When the response arrives, store the data in state, triggering a render to update your UI. Fetch data in `componentDidMount`. When the response arrives, store the data in state, triggering a render to update your UI.
When processing the response of an asynchronous request, be sure to check that the component is still mounted before updating its state by using `this.isMounted()`.
This example fetches the desired Github user's latest gist: This example fetches the desired Github user's latest gist:
```js ```js
@ -25,10 +27,12 @@ var UserGist = React.createClass({
componentDidMount: function() { componentDidMount: function() {
$.get(this.props.source, function(result) { $.get(this.props.source, function(result) {
var lastGist = result[0]; var lastGist = result[0];
this.setState({ if (this.isMounted()) {
username: lastGist.owner.login, this.setState({
lastGistUrl: lastGist.html_url username: lastGist.owner.login,
}); lastGistUrl: lastGist.html_url
});
}
}.bind(this)); }.bind(this));
}, },

Loading…
Cancel
Save