class Life extends React.Component{
      // 構(gòu)造器
      constructor(props){
        console.log('Life構(gòu)造器---constructor');
        super(props)
        this.state={num:0}
      }
      // 計(jì)算+1功能
      add=()=>{
        const {num} = this.state
        this.setState({num:num+1})
      }
      // 刪除組件
      death=()=>{
        ReactDOM.unmountComponentAtNode(document.getElementById('text'))
      }
      force=()=>{
        this.forceUpdate()
      }
      // 將要掛載
      componentWillMount(){
        console.log('Life將要掛載---componentWillMount');
      }
      // 已經(jīng)掛載
      componentDidMount(){
        console.log('Life已經(jīng)掛載---componentDidMount');
      }
      // 刪除觸發(fā)
      componentWillUnmount(){
        console.log('Life刪除觸發(fā)---componentWillUnmount');
      }
      // 是否應(yīng)該改變數(shù)據(jù)
      shouldComponentUpdate(){
        console.log('Life是否改變數(shù)據(jù)---shouldComponentUpdate');
        return true
      }
      // 將要改變數(shù)據(jù)
      componentWillUpdate(){
        console.log('Life將要改變數(shù)據(jù)---componentWillUpdate');
      }
      // 改變數(shù)據(jù)
      componentDidUpdate(){
        console.log('Life改變數(shù)據(jù)---componentDidUpdate');
      }
      render(){
        console.log('Life---render');
        const {num} = this.state
        return(
          <div>
          <h1>計(jì)數(shù)器：{num}</h1> 
          <button onClick={this.add}>點(diǎn)我+1</button> 
          <button onClick={this.death}>刪除</button> 
          <button onClick={this.force}>不更改任何狀態(tài)的數(shù)據(jù)，強(qiáng)制更新</button> 
          </div>
        )
      }
    }
    // 渲染頁面
    ReactDOM.render(<Life />, document.getElementById('text'))