文章12
标签10
分类3

React的生命周期函数笔记

记录学习React生命周期函数的笔记

生命周期函数

指在某一个时刻组件会自动执行的函数。

Initialization 初始化

初始化数据,如props和state,在constructor初始化

Mounting 挂载流程

1.componentWillMount
在组件即将被挂载到页面的时刻自动执行,在render前执行。
2.render
做页面的挂载,props或state更新,render会重新渲染。所有生命周期函数除了render都可以不存在。
3.componentDidMount
在组件被挂载到页面后,自动被执行。

Updation 更新流程

props更新
1.componentWillReceiveProps
当一个组件从父组件接受了参数,只要父组件的render函数重新被执行了,子组件的这个生命周期函数就会被执行。(如果这个组件第一次存在于父组件中,不会执行。如果这个组件之前已经存在于父组件中,才会执行)。

组件更新共有函数方法

1.shouldComponentUpdate
组件被更新之前,他会自动被执行, 需要返回一个bool类型的值,返回false 组件无论输入任何值都不会更新。跳过其他更新函数不会执行。
2.componentWillUpdate
组件被更新之前,它会自动执行,但是他在shouldComponentUpdate之后被执行,如果shouldComponentUpdate返回true它才执行,如果返回false,这个函数就不会被执行了。
3.componentDidUpdate
组件更新完成之后,他会被执行.ajax请求一般放在这里,因为他只会执行一次。

Unmouting 组件卸载(移除)流程

1.componentWillUnmount
组件即将被从页面中剔除的时候,会执行

本文作者:Bunrun
本文链接:https://www.bugrun.cn/posts/8702.html
版权声明:本文采用 CC BY-NC-SA 3.0 CN 协议进行许可