React严格定义了组件的生命周期,主要有三个过程:
装载过程(Mount),组件第一次在DOM树中渲染的过程。
更新过程(Update),当组件被重新给 i 呢渲染的过程。
卸载过程(Unmount),组件从DOM中删除的过程。
1、组件的装载过程
当组件第一次被渲染的时候,依次调用的函数为:
constructor:类的构造函数,主要作用是初始化state、绑定成员函数的this环境;
getInitialState:初始化组件的this.state;
getDefaultProps:函数的返回值可以作为props的初始值;
componentWillMount:在render之前被调用;
render:返回一个JSX描述的结构,根据this.state和this.props来决定返回的结果,最终由React来操作渲染过程;
componentDidMount:在render之后被调用,此时组件已被挂载到DOM树上,可以通过ajax获取数据来填充组件的内容;
2、组件的更新过程
componentWillReceiveProps(nextProps):当伏组件的render函数被调用时,不管传给子组件的props有无变化,都会触发子组件的此函数;
shouldComponentUpdate(nextProps, nextState):决定组件什么时候不需要渲染,此方法返回一个布尔值,默认为true,默认每个更新过程都要重新渲染,如果使用得当会极大的提高性能。
componentWillUpdate:在更新之前执行;
render:渲染页面;
componentDidUpdate:在render之后被调用,此时组件已经更新;
3、组件的卸载过程
componentWillUnmount:组件卸载完成之后执行;