import React, { Component } from 'react';
import $ from  'jquery'

// 封装组件
class Hellow extends React.Component{
  constructor(props){
      super(props);
      // 设置初始为空
      this.state = { username:'',lastGistUrl:''}
  }

  // 渲染后调用
  componentDidMount(){
      // 使用 jQuery 完成 Ajax 请求
      this.serverRequest = $.get(this.props.source,function(result){
          let lastGist = result[0];
          // 更新
          this.setState({
              username:lastGist.owner.login,
              lastGistUrl:lastGist.html_url
          });
      }.bind(this));
  }
  // 卸载时调用
  componentWillUnmount(){
      // 出现异常时退出
      this.serverRequest.abort();
  }


  render(){
      return(
          <div>
              {/* 跳转地址为最新链接 显示地址也是*/}
              {this.state.user}用户最新的 Gist 共享地址：
              <a href={this.state.lastGistUrl}>{this.state.lastGistUrl}</a>
          </div>
      );
  }
}

export default Hellow;

// 在父组件调用时设置网址，内部通过props获取
// <Hellow source="https://api.github.com/users/octocat/gists" />