2.2 react 钩子函数 子挂父挂 子更父不更 父更子更

老钩子

1 组件取props和state

constructor(props){
super(props) ==getDefaultProps
this.state == 这里可以直接修改state 不能用`setstate`
}

构造器
等于触发 getDefaultProps +getInitailState
2 组件即将挂载 componentWillMount
3 描画Vdom render
4 组件挂载完毕 componentDidMount 这里才可以用ref和setState

更新期：

1 props是否改变

componentWillReceiveProps(nextProps){
this.props 是修改前的props nextProps是新的props
}

2 判断是否要更新 shouldComponentUpdate 需要返回布尔值
3 即将更新 componentWillUpdate
4 描画dom render 不能再这里修改数据 不然又会触发
5 更新描画结束 componentDidUpdate

卸载

组件被卸载时触发 componentWillUnmount

新钩子

componentWillUpdate/componentWillMount/componentWillReceiveProps =》getDerivedStateFromProps render前 三个老钩子被替换
用法：

static getDerivedStateFromProps(nextProps,nextState){//新props和新state
//无法访问this
//必须返回一个对象用于更新state 也可返回null
//必须初始化state的值 就是再construct要有state 


}

getSnapshotBeforeUpdate 返回快照 render之后 返回要渲染到dom的快照