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