您的位置:首页 > Web前端 > React

React学习之路(一)

qq_36207983 2017-10-18 14:59 76 查看

React组件的生命周期

React严格定义了组件的生命周期,生命周期可能会经历如下三个过程:

装载过程(Mount),也就是吧组件第一次在DOM树中渲染的过程;

更新过程(Update),当组件被重新渲染的过程;

卸载过程(Unmount),组件从DOM中删除的过程。

三种不同的过程,React库会一次调用组件的一些成员函数,这些函数称为生命周期函数。所以,要定制一个React组件,实际上就是定制这些生命周期函数。

一、装载过程

当组件第一次被渲染的时候,依次调用以下函数:

constructor

getInitialState

getDefaultProps

componentWillMount

render

componentDidMount

二、更新过程

当组件被装载到DOM树上之后,改组件可以随着用户操作改变展现的内容,当props或者state被修改的时候,就会引发组件的更新过程。

更新过程会依次调用斜面的生命周期函数,其中render函数和装载过程一样,没有差别。

componentWillReceiveProps

shouldComponentUpdate

componentWillUpdate

render

componentDidUpdate

三、卸载过程

React组件的卸载过程只涉及一个函数:

componentWillU nmount
标签:  React