React 组件的生命周期概念图
react组件的生命周期.jpg
装载组件触发
-
componentWillMount
在首次渲染之前，** render 之前调用**
-
componentDidMount
该方法被调用时，已经渲染出真实的 DOM，在render 之后调用
更新组件触发
-
componentWillReceiveProps
接收到新的props调用， -
shouldComponentUpdate
接收到新的props或state，要渲染前调用，通过返回 false 来阻止组件的重新渲染 -
componentWillUpdate
接收到新的props或state前立即调用 -
componentDidUpdate
组件更新之后操作DOM
在组件重新被渲染之后，componentDidUpdate(object prevProps, object prevState) 会被调用。可以在这里访问并修改 DOM
卸载组件触发
- componentWillUnmount
组件从DOM中移除时被立即调用，完成所有的清理和销毁工作，在 componentDidMount 中添加的任务都需要再该方法中撤销，如创建的定时器或事件监听器。
参考
https://segmentfault.com/a/1190000004168886#articleHeader3
网友评论