50.React学习 —— 组件的生命周期

组件的生命周期

生命周期图谱

组件的生命周期三个大阶段

挂载阶段

constructor ==> render ==> componentDidMount

constructor: 创建组件时，最先执行 . 一般用于: 1. 初始化state 2. 为事件处理程序绑定this

render: 每次组件渲染都会触发 注意: 不能在render中调用setState()

componentDidMount: 组件挂载(完成DOM)渲染后 一般用于: 1. 发送网络请求 2. DOM操作

更新阶段

render ==> componentDidUpdate

setState() , forceUpdate(), 组件接收到新的props 都会导致更新

componentDidUpdate: 组件更新(完成DOM渲染)后

1 发送网络请求 2 DOM操作 注意：如果要setState() 必须放在一个if条件中

卸载阶段

componentWillUnmount

componentWillUnmount: 组件卸载(从页面中消失） 执行清理操作

旧版react生命周期(了解)

componentWillMount

componentWillUpdate,

componentWillReceiveProps

以上生命周期钩子函数在React v16.3后废弃

上一篇：组件(props)、状态(state)、this指向、ref
下一篇：组件通讯