React学习日记

es2015版本：

//需要 jquery库
class MyList extends React.Component {
    constructor(...args) {
      super(...args);
      this.state = {
        loading: true,
        error: null,
        data: null
      };
    }

    componentDidMount() {
      const url = 'https://api.github.com/search/repositories?q=javascript&sort=stars';
      $.getJSON(url)
       .done(
        (value) => this.setState({
          loading: false,
          data: value
        })
      ).fail(
        (jqXHR, textStatus) => this.setState({
          loading: false,
          error: jqXHR.status
        })
      );
    }

    render() {
      if (this.state.loading) {
        return Loading...;
      }
      else if (this.state.error !== null) {
        return Error: {this.state.error};
      }
      else {
        /* 你的代码填入这里 */
        // console.log(this.state.data);
        let projects = this.state.data.items,
            result = [];
        projects.forEach(p => {
          let item = 
{p.id}:{p.name}
;
          result.push(item);
        });
        return (
          

            
API 数据获取成功
            

              {result}
            

          
        );
      }
    }
  };

  ReactDOM.render(
    ,
    document.getElementById('example')
  );