react的生命周期

react定义了严格的生命周期，生命周期可能会经历下述过程：

1. 装载过程（Mount），把组件第一次在DOM中渲染的过程；
2. 更新过程（UPDATE），当组件被重新渲染的过程；
3. 卸载过程（Unmount），组件从DOM中移除的过程。

首先装载过程：

当组件第一次被渲染时，依次调用如下函数：

• constructor
• componenetWillMount
• render
• ComponentDidMount

构造函数 constructor目的：初始化state和绑定成员函数this的环境。

render函数，React中最重要的函数，该韩式必须要实现，render不做实际的渲染，即该函数不会网DOM树上渲染或加载内容，只是返回一个JSX描述的结构，最终有React进行渲染。render应该是一个纯函数，返回的结果应当完全首this.state与this,props影响。

componentWillMount会在调用render函数之前进行调用，这个函数发生在将要进行装载之前，但是这个时候页面尚未进行渲染，因此这个函数里面大部分需要定义的功能，可以提前到constructor中做,，可以向后抬获取数据

componentDidMount会在render函数调用之后并且DOM树已经完成装载后进行调用，并且该函数只能在浏览器端执行，react可以与其他UI库进行配，例如绘图功能使用到d3.js，这个时候jquery就可以卸载该函数中，也就是等到DOM加载完成，然后呃昂jquery在该DOM上去完善或增强。

其次，更新过程：

• componentWillReceiveProps
• shouldComponentUpdate
• componentWillUpdate
• render
• componentDidUpdate

conponentWillReceiveProps函数，在父组件的render函数调用，无论父组件传递给子组件的props是否变化，子组件的该方法都会出发。this.setState方法更新过程不会触发该函数。

shouldComponentUpdate该函数返回一个bool值，告知react本次更新过程是否继续，合理利用可提高性能

conponenntWillUpdate与componentDidUpdate在render方法一前一后执行

最后，卸载过程；

• componentWillUnmount

componentWillUnmount函数在react组件要从DOM树中删除的时候调用，该函数适合做一些请理性的工作，例如在之前声明的一些飞react方法，可以在该方法中移除，可以避免内存泄漏。

转载于:https://www.cnblogs.com/yangshixiong/p/11340748.html