React组件的生命周期简介

1.生命周期概述：

        React生命周期简单描述，大体上可分为以下4个阶段，初始阶段、挂载阶段、更新阶段和移除阶段。每个阶段都有对应的方法，这篇文章主要记录一下方法的执行过程，以及一些tips.

初始阶段：对应有两个方法getDefaultProps和getInitialState,分别返 回一个对象，用来设置初始化的属性和状态。

挂载阶段：主要有componentWillMount 和componnetDidMount方法。

更新阶段：主要有shouldComponentUpdate、componentWillUpdate、componentDidUpdate等。

移除阶段：componnetWillunmount和componentDidunmount方法。

2.方法的执行顺序;

在组件首次被实例化时(不考虑初始化属性和状态情况下)，通过执行constructor -> componentWillmount -> render -> componentDidmount。当父组件this.setState后，执行shouldComponnetUpdate -> render 。

3.避免过度渲染，以下案例中父组件index.ios.js中有两个子组件Acomponnent和Bcomponent，父组件分别传给Acomponennt和Bcomponent属性A，B。通过点击事件，调用setState改变B的值，而为改变A的值，正常情况下A,B均会渲染，而在A中的shouldCompoentUpdate中设置A属性没变化时，返回false，来避免过度渲染。代码如下：

index.ios.js代码：

Acomponnet组件代码：

B组件代码：

TestsetStateFUN.js:

结果截图：