react的生命周期函数（钩子）

三个阶段

• 创建阶段
• 运行和交互阶段
• 卸载阶段

第一个阶段： 创建阶段

constructor

作用： (1) 获取props (2) 初始化state

render

作用：渲染组件到页面中，无法获取页面中的DOM对象
注意：不要在render方法中调用 setState() 方法，否则会递归渲染
原因说明：状态改变会重新调用render()，render()又重新改变状态

componentDidMount()

（1） 组件已经挂载到页面中
（2） 可以进行DOM操作，比如：获取到组件内部的DOM对象
（3） 可以发送请求获取数据
（4） 可以通过 setState() 修改状态的值
注意：在这里修改状态会重新渲染

第二个阶段： 运行和交互阶段

特点：该阶段的函数执行多次
说明：每当组件的props或者state改变的时候，都会触发运行阶段的函数

shouldComponentUpdate(nextProps, nextState)

作用：根据这个方法的返回值决定是否重新渲染组件，返回true重新渲染，否则不渲染
优势：通过某个条件渲染组件，降低组件渲染频率，提升组件性能
说明：如果返回值为false，那么，后续render()方法不会被调用
注意：这个方法必须返回布尔值！！！

render() 渲染

作用：重新渲染组件，与Mounting阶段的render是同一个函数
注意：这个函数能够执行多次，只要组件的属性或状态改变了，这个方法就会重新执行

componentDidUpdate(prevProps, prevState)

作用：组件已经被更新
参数：旧的属性和状态对象

第三个阶段： 卸载阶段

componentWillUnmount()
组件卸载期间，只有一个函数，这个函数也有一个显著的特点：组件一辈子只能执行一次
使用说明
只要组件不再被渲染到页面中，那么这个方法就会被调用（ 渲染到页面中 -> 不再渲染到页面中 ）

作用：在卸载组件的时候，执行清理工作，比如清除定时器