Latest web development tutorials

AJAX 반응

서버의 데이터베이스에 대한 액세스 메소드 this.setState UI를 다시 렌더링 그 상태에서 데이터를 저장할 수 있고 동시에 부품 데이터가 componentDidMount 방법 Ajax를 얻을 수있다 반응한다.

비동기 데이터 로딩을 사용하는 경우, 사용 componentWillUnmount 전에 어셈블리를 언로드하는 뛰어난 요청을 취소합니다.

다음의 예는 최신 요지 Github에서 사용자 점유율 설명을 얻기 보여줍니다

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

»시도

위의 코드는 jQuery를 Ajax 요청이 완료 될 때 사용합니다.