reaccionar AJAX

Reaccionan datos de los componentes pueden ser obtenidos por el método componentDidMount Ajax, mientras que el acceso a la base de datos del servidor puede almacenar datos en el estado, y luego re-Método de representación this.setState interfaz de usuario.

Cuando se utiliza la carga de datos asíncrona, el conjunto de descarga antes de su uso componentWillUnmount para cancelar solicitudes pendientes.

El siguiente ejemplo demuestra Obtener última GIST Github usuarios compartir Descripción:

var UserGist = React.createClass({
  getInitialState: function() {
    return {
      username: '',
      lastGistUrl: ''
    };
  },

  componentDidMount: function() {
    this.serverRequest = $.get(this.props.source, function (result) {
      var lastGist = result[0];
      this.setState({
        username: lastGist.owner.login,
        lastGistUrl: lastGist.html_url
      });
    }.bind(this));
  },

  componentWillUnmount: function() {
    this.serverRequest.abort();
  },

  render: function() {
    return (
      <div>
        {this.state.username} 用户最新的 Gist 共享地址：
        <a href={this.state.lastGistUrl}>{this.state.lastGistUrl}</a>
      </div>
    );
  }
});

ReactDOM.render(
  <UserGist source="https://api.github.com/users/octocat/gists" />,
  mountNode
);

Trate »

El código anterior utiliza jQuery Ajax solicitud se ha completado.