初始化阶段
constructor(props)- 这是组件类的构造函数，通常在此初始化
state数据模型。
constructor(props) {
super(props);
this.state = {
//key : value
};
}
componentWillMount- 表示组件将要加载到虚拟
DOM，在render方法之前执行，整个生命周期只执行一次。
componentWillMount() {
}
componentDidMount- 表示组件已经加载到虚拟
DOM，
- 在
render方法之后执行，整个生命周期只执行一次。
- 通常在该方法中完成异步网络请求或者集成其他
JavaScript库
componentDidMount() {
}
运行阶段
componentWillReceiveProps(nextProps)- 在组件接收到其父组件传递的props的时候执行,参数为父组件传递的
props。
- 在组件的整个生命周期可以多次执行。
- 通常在此方法接收新的
props值，
- 重新设置
state。
componentWillReceiveProps(nextProps) {
this.setState({
//key : value
});
}
shouldComponentUpdate(nextProps, nextState)- 在
componentWillReceiveProps(nextProps)执行之后立刻执行；
- 或者在
state更改之后立刻执行。
- 该方法包含两个参数，分别是props和state。
- 该方法在组件的整个生命周期可以多次执行。
- 如果该方法返回
false，
- 则
componentWillUpdate(nextProps, nextState)及其之后执行的方法都不会执行，组件则不会进行重新渲染
- 用于拦截
props和state做一些逻辑判断
shouldComponentUpdate(nextProps, nextState) {
return true;
}
componentWillUpdate(nextProps, nextState)- 在
shouldComponentUpdate(nextProps, nextState)函数执行完毕之后立刻调用，
- 该方法包含两个参数，分别是
props和state。
-
render()函数执行之前调用。
- 该方法在组件的整个生命周期可以多次执行
componentWillUpdate(nextProps, nextState) {
}
componentDidUpdate(preProps, preState)- 在
render()方法执行之后立刻调用。
- 该方法包含两个参数，分别是
props和state。
- 该方法在组件的整个生命周期可以多次执行。
- 通常用于更新完毕在这里做一些操作
componentDidUpdate(preProps, preState) {
}
render()-
render方法用于渲染组件。在初始化阶段和运行期阶段都会执行。
render() {
return(
<View/>
);
}
销毁阶段
componentWillUnmount()- 销毁时调用，通常用来取消时间绑定
- 移除虚拟DOM中对应组建的数据结构
componentWillUnmount() {
}
