react组件的生命周期（新和旧）

组件生命周期的理解

1. 组件从创建到死亡它会经历一些特定的阶段。
2. React组件中包含一系列勾子函数(生命周期回调函数), 会在特定的时刻调用。
3. 我们在定义组件时，会在特定的生命周期回调函数中，做特定的工作。

 生命周期流程图（旧）

 

生命周期的三个阶段（旧）

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

1. 1. 1. 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：做一些收尾工作, 如: 清理定时器

即将废弃的钩子 

1. componentWillMount
2. componentWillReceiveProps
3. componentWillUpdate
4. 现在使用会出现警告，下一个大版本需要加上UNSAFE_前缀才能使用，以后可能会被彻底废弃，不建议使用。

 以上就是react的生命周期中所有的内容。