react中生命周期钩子

    <script type="text/babel">
      class Test extends React.Component {
        state = {opacity:1,count:100}
        render(){

          return(
            <div>
              <h1 style={{opacity:this.state.opacity}}>测试1</h1>
              <button onClick={this.death}>按钮</button>
              count{this.state.count}
            </div>
          )
        }
        death = () =>{
          //卸载组件
          ReactDOM.unmountComponentAtNode(document.getElementById('test'))
        }
        //组件挂载后执行，只执行一次
        componentDidMount(){
          this.setState({count:this.state.count-1})
        this.untime = setInterval(() =>{
            let {opacity} = this.state
            if (opacity <=0) opacity = 1
            
            this.setState({opacity:opacity -0.2})
          },200)
        }
        //组件即将卸载时执行，只执行一次
        componentWillUnmount() {
          console.log('render卸载了')
          clearTimeout(this.untime)
        }
      }
      //渲染组件
      ReactDOM.render(<Test />,document.getElementById('test'))
    </script>