react生命周期

三大生命周期状态：

                        Mount：插入真实Dom

                         Update：被重新渲染

                         Unmount：被移除真实Dom

class Life extends React.component{

    constructor(props){

       super(props);

     console.log('constructor()--->创建组件对象');

   this.state={

        name:'Tom' 

    }

   }  

 componentWillMount(){

  console.log('componentWillMount()--->将要挂载') ;

  //延时更新state

  // setTimeout(function(){ this.setState({name:'Linda'})}.bind(this),3000)

  setTimeout(()=>{this.setState({name:'Linda'})},3000)

//延时移除组件

 setTimeout(()=>{

     ReactDom.unmountComponentAtNode(document.getElementById('root')) 

  },6000)

}

   render(){

      console.log('render()-->正在渲染中')

      return (

            <h2>生命周期测试组件</h2>

           <h2>姓名：{this.state.name}</h2>

            <h2>年龄：{this.props.age.}</h2>

         )

    }

 componentDidMount(){

    console.log('componentDidMount()-->已经挂载,这时发送ajax请求')

  }

componentWillUpdate(){

   console.log('componentWillUpdate()-->将要更新')  

}

componentDidUpdate(){

   console.log('componentDidUpdate()-->已经更新')  

}

componentWillUnmount(){

   console.log('componentWillUnmount()-->将要被移除')

  }

componentWillReceWillReceiveProps(){

   }

}

ReactDom.render(<Life age={12}>,document.getElementById('root'))