React-Native 第三章 生命周期介绍和使用

介绍

可以把组件生命周期大致分为三个阶段

• 第一阶段 ： 是组件第一次绘制阶段，如图中的上面虚线框内，在这里完成了组件的加载和初始化。
• 第二阶段 : 是组件在运行和交互阶段，如图中左下角虚线框，这个阶段组件可以处理用户交互，或者接收事件更新界面。
• 第三阶段 ： 是组件卸载消亡的阶段，如图中右下角的虚线框中，这里做一些组件的清理工作。

实例化阶段的函数功能分析

下面来详细介绍生命周期中的各回调函数
1. getDefaultProps
该函数用于初始化一些默认的属性，通常会将固定的内容放在这个函数中进行初始化和赋值；
在组件中，可以利用this.props获取在这里初始化它的属性，由于组件初始化后，再次使用该组件不会调用getDefaultProps函数，所以组件自己不可以自己修改props,只可由其他组件调用它时在外部修改。
2. getInitial Statr
该函数是用于对组件的一些状态进行初始化
由于该函数不用于getDefaultProps,在以后的过程中，会再次调用，所以可以将控制控件的状态的一些变量放在这里初始化，如控件上显示的文字，可以通过this.state来获取值，通过this.setState来修改state值。
注意：一旦调用了this.setState方法，组件一定会调用render方法，对组件进行再次渲染，不过，如果React框架会自动根据DOM的状态来判断是否需要真正的渲染。
3. componentWillMount
在组件将要被加载在视图上之前调用，功能相对较少
4. render
render是一个组件中必须有的方法，本质上是一个函数，并返回JSX或其他组件来构成DOM,和Android的XML布局类似，注意：只能返回一个顶级元素；
此外，在render函数中，只可通过this.state和this.props来访问在之前函数中初始化的数据值。
5. componentDidMount
在调用了render方法后，组件加载成功并被成功渲染出来以后，所要执行的后续操作，一般会在这个函数中处理网络请求等加载数据的操作。
因为UI已经成功被渲染出来，所以放在这个函数里进行请求操作，不会出现UI上的错误。
此方法中加载网络数据

存在期阶段函数功能分析

1. componentWillReceiveProps
指父元素对组件的props或state进行了修改
2. shouldComponentUpdate
一般用于优化，可以返回false或true来控制是否进行渲染
3. componentWillUpdate
组件刷新前调用
4. componentDidUpdate
更新后的hook

销毁期阶段函数功能分析

1. componentWillUnmount
用于清理一些无用的内容，如：点击事件Listener,只有一个过程。