react生命周期
# 01. 16.4+版本
# React 生命周期分为三种状态
- 挂载
- 更新
- 销毁
# 挂载
# 01. constructor():
在这个阶段，会获取到外层传递的props数据，这里进行组件初始化的工作，内部state的定义，和组件本身逻辑的初始化。只在组件创建时执行一次，其后不再执行。
# 02. static getDerivedStateFromProps(nextProps, prevState)：
它是一个静态方法，在这里不能调用this，开发者使用时不能写出副作用的代码。通过参数提供的nextProps以及prevState来进行判断，根据新传入的props来映射到state，保证了 state 和 props 之间的简单关系以及不需要处理第一次渲染时 prevProps 为空的情况。 nextProps：第一个参数是父组件传来的props中的数据 prevState：第二个参数是本组件state中的数据。
必须return一个对象或null。如果是对象，则会合并到本组件的state中去。
static getDerivedStateFromProps(nextProps, prevState) {
const {type} = nextProps;
// 当传入的type发生变化的时候，更新state
if (type !== prevState.type) {
return {
type,
};
}
// 否则，对于state不进行任何操作
return null;
}
# 03. render()：
渲染页面的主要地方，其中可以实现一些操作，但是必须返回一个jsx对象。会反复调用，减少不必要的render()函数调用次数可以实现性能优化。
# 04 componentDidMount():
在render之后调用，在这里可以操作更新后的组件DOM
# 组件更新：
触发组件的更新条件：
- 本组件自身调用setState，会触发re-render（重新渲染）。
- 父组件触发re-render，子组件连带着被re-render。
- props改变了，会触发本组件re-render。
# 01. static getDerivedStateFromProps()
与组件创建时一样操作。
# 02. shouldComponentUpdate()：
主要用来对reacr进行性能优化。返回一个true或false。默认返回true
- 第一个参数为nextProps: 马上要生效的props值，
- 第二个参数为nextState：马上要生效的state值。获取现在的值为this指针。 return false; 就不会向下执行，也就减少了render次数，优化了性能。
提示
PureComponent比较props中的所有属性，优先决定当前组件是否需要re-render。 但是：PureComponent只做简单的属性值“浅比较”。 浅比较对于值类型还可以，对于引用类型只会比较它们在内存中的地址是否相同，不会进行深层次的比较。 若传过来一个地址不同，内容相同的引用类型，PureComponent无法进行深层次比较。
# 03.render()：
更新阶段渲染，可以根据新的数据渲染组件的dom节点。
# 04. getSnapshotBeforeUpdate():
在该函数中一般执行一些dom操作。记录滚动位置。 例如：可以滚动的页面，刷新后，需要在本函数中记录其位置，然后传给componentDidUpdate()函数，在更新结束后，回到该位置。 有两个参数：prevProps,prevState。必须return
getSnapshotBeforeUpdate(prevProps, prevState){
return { y: 50 }
}
componentDidUpdate(prevProps, prevState, snapshot){
console.log(snapshot) // { y: 50 }
}
# 05. componentDidUpdate():
该函数主要在更新完成时执行。
- prevProps: 第一个参数为prevProps,更新前的props值，
- prevState: 第二个参数表示更新前的state中的值。当前值为this.props。
- 第三个参数为getSnapshotBeforeUpdate()return传过来的数据。
这个函数表示最新的state对应的dom更新完毕，所以可以对最新的dom做一些自定义操作。
# 组件卸载:componentWillUnmount
在组件被卸载前调用，这里会处理一些数据清理、定时器清理等工作来避免内存泄露。主要用来释放相关的内存空间和资源。
# 02. 16.3-16.0 版本：
# 03. <16.0 版本：
