react生命周期的学习与总结

框架的生命周期就是特定阶段调用的钩子函数 有了生命周期才像一个框架
一个组件的生命周期有四个
1.initial 执行初始化 props state都有了
2.mounting 挂载阶段 【要挂载吗】有一个render
3.updating 修改 【要修改吗】 shouldComponentUpdate(nextProps,nextState)
4.unmounted 卸载

组件首次加载时执行顺序(react16.3之后一下加粗生命周期被取消)
componentWillMount -> render - > componentDidMount
组件更新时
shouldComponentUpdate - > componentWillUpdate - > render -> componentDidUpdate
如果props更新了会在shouldComponentUpdate前加一个componentWillRceiveProps

react16.3之后
首次加载
static getDrivedStateFromProps - > render -> componentDidMount
组件跟新
static getDrivedStateFromProps - > shouldComponnentUpdate - >render -> getSnapShotBeforeUpdate - > componentDidUpdate

// 组件即将被渲染 装载到真正的页面上
    componentWillMount() {}
// 组件被真正装载
    componentDidMount() {}

// 组件要更改吗
    shouldComponentUpdate(nextProps, nextState) {
        // 在前后name值不相等的时候才继续重新渲染
        if (nextState.count != this.state.count) {
            console.log("shouldComponentUpdate")
            return true
        } else {
            return false
        }
    }
//组件即将更新
    componentWillUpdate() {}
// 组件已经更新
    componentDidUpdate() {}

//组件即将被销毁
    componentWillUnmount() {}