react基础入门之生命周期

先贴一段代码

    class Clock extends React.Component {
      constructor(props) {
        super(props);
        this.state = {date: new Date()};
      }

     componentDidMount() {
        this.timerID = setInterval(
          () => this.tick(),
              1000
        );
          }

    componentWillUnmount() {
       clearInterval(this.timerID);
      }

    tick() {
    this.setState({
     date: new Date()
    });
      }

   render() {
    return (
  <div>
    <h1>Hello, world!</h1>
    <h2>It is {this.state.date.toLocaleTimeString()}.</h2>
  </div>
    );
  }
}

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

constructor为构造函数可以初始化一些值丶当Dom执行完毕后会直接之后componentDidMount函数这个钩子直接调用定时器，componentWillUnmount生命周期钩子中卸载计时器，实现时间实时刷新