react 新旧生命周期

生命周期三个阶段（旧）

1.初始化阶段：由ReactDOM.render()触发--初次渲染

            1.constructor();

            2.componentWillMount();

            3.render();

            4.componentDidMount()  ==> 常用

　　　　　　　　　　　　　　　　　（一般在这个钩子中做一些初始化的事，例如：发送网络请求。开启定时器，订阅消息）

2.更新阶段：由组件内部 this.setSate()或父组件重新render触发

            1.shouldComponentUpdate();

            2.componentWillUpdate();

            3.render();  ==》 必须使用

            4.componentDidUpdate();

 

 3.卸载组件：由ReactDOM.unmountComponentAtNode()触发

            1.componentWillUnmount() ==》常用

　　　　　　　　　　　　　　　　　　（一般在这个钩子中做一些收尾的事：例如 关闭定时器，取消订阅消息）

 

生命周期三个阶段（新）

1.初始化阶段：由ReactDOM.render() 触发 --- 初次渲染

            1.constructor（）

            2.getDerivedStateFromProps

            3.render();

            4.componentDidMount();  ====>常用

       

2.更新阶段：由组件内部this.setSate() 或父组件重新render触发

           1.getDerivedStateFromProps

           2.shouldComponentUpdate()

           3.render()

           4.getSnapshotBeforeUpdate

           5.componentDidUpdate()

       

3.卸载组件：由ReactDOM.unmountComponentAtNode()触发

          1.componentWillUnmount();  ===》常用

 

 

三个重要的钩子

          1.render：初始化渲染或更新渲染调用

          2.componentDidMount 开启监听，发送ajax请求

          3.componentWillUnMount: 做一些收尾工作，清理定时器等。。。

 

即将废弃的钩子（在17版本可以使用，但会发出废弃警告）添加UNSAFE，以后可能会废弃，不建议使用

          1.componentWllMount

          2.componentWillReceiceProps

          3.componentWillUpdate