react native生命周期学习总结

rn组件的生命周期
组件的生命周期分成三个状态：
  ● Mounting：已插入真实 DOM
  ● Updating：正在被重新渲染
  ● Unmounting：已移出真实 DOM
React为每个状态都提供了两种处理函数，will 函数在进入状态之前调用，did 函数在进入状态之后调用，三种状态共计五种处理函数。
  ● componentWillMount()
  ● componentDidMount()
  ● componentWillUpdate(object nextProps, object nextState)
  ● componentDidUpdate(object prevProps, object prevState)
  ● componentWillUnmount()
此外，React 还提供两种特殊状态的处理函数。
  ● componentWillReceiveProps(object nextProps)：已加载组件收到新的参数时调用

  ● shouldComponentUpdate(object nextProps, object nextState)：组件判断是否重新渲染时调用

再加上初始化属性和状态(getDefaultProps和getInitialState),以及渲染(render()),共计10个回调函数:

1、object getDefaultProps()

用于初始化一些默认的属性，通常会将固定的内容放在这个函数中进行初始化和赋值；  

在组件中， 可以利用this.props获取在这里初始化它的属性 ，由于组件初始化后，再次使用该组件不会调用getDefaultProps函数，所以组件自己不可以自己

改props（即：props可认为是只读的），只可由其他组件调用它时在外部修改,再传入.

2、object getInitialState()

用于对组件的一些状态进行初始化；

由于该函数不同于getDefaultProps，在以后的过程中，会再次调用，所以可以将控制控件的状态的一些变量放在这里初始化，如控件上显示的文字，

可以通过this.state来获取值，通过this.setState来修改state值， 比如：

this .setState ({ 

name: 'yang',

age: 23  

}); 注意： 一旦调用了this.setState方法，组件一定会调用render方法，对组件进行再次的渲染 ，不过，如果React框架会自动根据DOM的状态来判断是否需要真正的

染。

3、componentWillMount ()

在组件将要被加载在视图上之前调用。

4、render()

这个方法是必须的，对视图进行渲染，也可以返回 null 或者 false 来表明不需要渲染任何东西。

5、componentDidMount()

在调用了render方法后，组件加载成功并被成功渲染出来以后，所要执行的后续操作， 一般会在这个函数中处理网络请求等加载数据的操作； 因为UI已经成功被渲染 出来， 所以放在这个函数里进行请求操作，不会出现UI上的错误。

6、componentWillReceiveProps(object nextProps)

在组件接收到新的 props 的时候调用, 指父元素对 组 件的props或state进行了修改,在初始化渲染的时候该方法不会调用。可以用于更新 state 来响应某个 prop 的改变。

7、shouldComponentUpdate(object nextProps, object nextState)

在接收到新的 props 或者 state，将要渲染之前调用，如果确定新的 props 和 state 不会导致组件更新，则此处应该 返回 false。返回true将进行渲染。

8、componentWillUpdate(object nextProps, object nextState)

在接收到新的 props 或者 state 并且shouldComponentUpdate返回true时调用。

 

9、componentDidUpdate(object prevProps, object prevState)

在组件的更新已经同步到 DOM 中之后立刻被调用。

10、componentWillUnmount()

在组件从 DOM 中移除的时候立刻被调用。在该方法中执行任何必要的清理，比如无效的定时器，或者清除在 componentDidMount 中创建的 DOM 元素。