组件的生命周期
constructor:构造函数
它的第一个语句必须是super(props)。
构造函数将在React Native组件被加载前最先调用,并且仅调用一次。这个生命周期函数最大的作用,就是在这里定义状态机变量。
componentWillMount:
在React Native组件的生命周期中,这个函数只会被执行一次。它在初始渲染(render函数被React Native框架调用执行)前被执行,当它执行完后,render函数会马上被React Native框架调用执行。如果在这个函数里调用setState函数改变了某些状态机变量的值,React Native框架不会执行渲染操作,而是等待这个函数执行完成后再执行初始渲染。React Native组件的子组件也有componentWillMount函数,并且会在父组件的componentWillMount函数之后被调用。
如果开发者需要从本地存储中读取数据用于显示,那么在这个函数里进行读取是一个很好的时机。
componentDidMount:
在React Native组件的生命周期中,这个函数只会被执行一次。它在初始渲染执行完成后会马上被调用。在React Native组件生命周期的这个时间点之后,开发者可以通过子组件的引用来访问、操作任何子组件。React Native组件的子组件也有componentDidMount函数,并且会在父组件的componentDidMount函数之前被调用。
如果React Native应用需要在程序启动显示初始界面后从网络侧获取数据,那么把从网络侧获取数据的代码放在这个函数里是一个不错的选择。
componentWillReceiveProps:
React Native组件的初始渲染执行完成后,当React Native组件接收到新的props时,这个函数将被调用。这个函数接受一个object参数,object里是新的props。
当React Native初次被渲染时,componentWillReceiveProps函数并不会被触发。
如果新的props会导致界面重新渲染,这个函数将在渲染前被执行。在这个函数中,老的props可以通过this.props访问,新的props在传入的object中。如果在这个函数中通过调用this.setState函数改变某些状态机变量的值,React Native框架不会执行对这些状态机变量改变的渲染,而是等componentWillReceiveProps函数执行完成后一起渲染。
shouldComponentUpdate:
React Native组件的初始渲染执行完成后,当React Native组件接收到新的state或者props时,这个函数将被调用。它接受两个object参数,其中第一个是新的props,第二个是新的state。这个函数需要返回一个布尔值,告诉React Native框架针对这次改变,React Native是否需要重新渲染本组件。
componentWillUpdate:
React Native组件的初始渲染执行完成后,React Native框架在重新渲染React Native组件前会调用这个函数。开发者可以在这个函数中为即将发生的重新渲染做一些准备工作,但开发者不能在这个函数中通过this.setState再次改变状态机变量的值。如果需要改变,则在componentWillReceiveProps函数中进行改变。
componentDidUpdate:
React Native组件的初始渲染执行完成后,React Native框架在重新渲染React Native组件完成后调用这个函数。传入的两个参数是渲染前的props和state。
componentWillUnmount:
在React Native组件被卸载前,这个函数将被执行。