4 React 组件生命周期

一个React组件的生命周期分为三个部分:实例化、存在期和销毁时。

1 实例化

1 getDefaultProps 这不是组件的生命周期的一部分 , 在组件被创建并加载候

2、getInitialState     # 来初始化组件的状态
3、componentWillMount  # 准备加载组件
4、render
5、componentDidMount   # 在组件第一次绘制之后,会调用 componentDidMount(),通知组件已经加载完成 一般开始异步加载数据再更新状态

2 存在期

1 状态改变 ---- shouldComponentUpdate 组件是否更新 ------更新 -----componentWillUpdate ---- render --- componentDidUpdate

shouldComponentUpdate: function(nextProps, nextState){
    return this.state.checked === nextState.checked;
    //return false 则不更新组件
}

2 外部props 改变 --- componentWillReceiveProps ---改变状态 如1

componentWillReceiveProps: function(nextProps){
    if(nextProps.checked !== undefined){
        this.setState({
            checked: nextProps.checked
        })
    }
}

3 销毁

卸载 unmount ---- componentWillUnmount

![avatar](http://7rf9ir.com1.z0.glb.clouddn.com/3-3-component-lifecycle.jpg

results matching ""

    No results matching ""