React_新生命周期

新生命周期流程图

*** 老版的生命周期不能和新生命周期使用

• static:静态属性:静态方法里面没有this.
• 返回的是null,不会更新
• 返回的是对象，就会更新

16.3.0）

创建阶段

• constructor
• static getDerivedStateFromProps(nextProps,prevState){return{}} 用static关键字，监听props变化，更新state状态，必须return一个对象或null，返回对象，会通过setState更新组件，返回null不会更新
• render 返回一个虚拟dom
• componentDidMount 可以操作dom

变化阶段

• shouldComponentUpdate表示组件是否会更新,返回true或者fasle,true会发生触发组件更新，false不会触发组件更新(停止执行)。

主要体现了性能优化:接收的是最新的props和上一次的state
shouldComponentUpdate(nextProps,nextState){
  console.log("第一个参数是props","第二个参数是state")
  return false;  //必须return出去一个结果
}

• render
• getSnapshotBeforeUpdate(prevProps,prevState){return{}} Snapshot快照，return一个对象或null，返回值作为componentDidUpdate的第三个参数存在，需要配合componentDidUpdate一起使用
• componentDidUpdate(prevProps,prevState,value){}

卸载

componentWillUnmount：清理的时候触发被卸载