2021-6-24 React复习 生命周期

旧的生命周期

1. 初始化阶段: 由ReactDOM.render()触发---初次渲染
				1.	constructor()
				2.	componentWillMount()
				3.	render()
				4.	componentDidMount() =====> 常用
		一般在这个钩子中做一些初始化的事，例如：开启定时器、发送网络请求、订阅消息
2. 更新阶段: 由组件内部this.setSate()或父组件render触发
			1.	shouldComponentUpdate()
			2.	componentWillUpdate()
			3.	render() =====> 必须使用的一个
			4.	componentDidUpdate()
3. 卸载组件: 由ReactDOM.unmountComponentAtNode()触发
		1.	componentWillUnmount()  =====> 常用
			一般在这个钩子中做一些收尾的事，例如：关闭定时器、取消订阅消息

新的生命周期：

新版生命周期与旧版生命周期相比，即将废除三个生命周期钩子，分别是componentWillMount()，componentWillUpdate()，componentWillReceiveProps().
同时引入了两个新的生命周期钩子：
getDerivesStateFromProps()和getSnapshotBeforeUpdate().

getDerivesStateFromProps() 只有在state的值完全取决于props的值时才使用。接收的参数是props

getSnapshotBeforeUpdate() 需要返回一个snapshot值或者null。这些值将传递给componentDidUpdate().
componentDidUpdate()可以接收三个参数，分别是prevProps，prevState，snapshot.

生命周期的三个阶段（新）
1. 初始化阶段: 由ReactDOM.render()触发---初次渲染
		1.constructor()
		2.getDerivedStateFromProps 
		3.render()
		4.componentDidMount()
2. 更新阶段: 由组件内部this.setSate()或父组件重新render触发
			1.getDerivedStateFromProps
			2.shouldComponentUpdate()
			3.render()
			4.getSnapshotBeforeUpdate
			5.componentDidUpdate()
3. 卸载组件: 由ReactDOM.unmountComponentAtNode()触发
			1.componentWillUnmount()

2.6.5. 重要的勾子
		1.render：初始化渲染或更新渲染调用
		2.componentDidMount：开启监听, 发送ajax请求
		3.componentWillUnmount：做一些收尾工作, 如: 清理定时器
2.6.6. 即将废弃的勾子
		1.componentWillMount
		2.componentWillReceiveProps
		3.componentWillUpdate
现在使用会出现警告，下一个大版本需要加上UNSAFE_前缀才能使用，以后可能会被彻底废弃，不建议使用。