## Re: Zero 学习一个组件

[hsipeng]

#componet

class Clock extends React.Component{
  constructor(props){
    super(props);
    this.state = {date: new Date()}
  }
  
  componentDidMount(){
    this.Timer = setInterval(() => this._tick(), 1000);
  }
  
  componentWillUnMount(){
    clearInterval(this.Timer);
  }
  
  _tick(){
    this.setState({
      date: new Date()
    })
  }
  
  render() {
    return(<div> this is {this.state.date.toLocaleTimeString()}</div>)
  }
}

ReactDOM.render(
  <Clock />,
  document.getElementById('root')
);

知识点

• ES6 的 class 是小写 小写 小写！！！
• React.Componet 和 React.createClass
• 生命周期(生命钩子)
• 无状态组件和高阶组件
• render 执行
• 。。。