组件的生命周期
React的生命周期从广义上分为三个阶段：Mounting(挂载)、更新(update)、Unmounting(卸载)
每个组件都包含 “生命周期方法”，用于在组件不同阶段执行自定义功能。在组件被创建并插入到 DOM 时（即挂载中阶段（mounting）），组件更新时，组件取消挂载或从 DOM 中删除时，都有可以使用的生命周期方法。
生命周期的各个阶段
挂载阶段
在创建组件时,会最先执行constructor()中的函数并初始化数据,页面完成初次渲染render(),并且每次组件渲染都会触发render(),在组件挂载（完成DOM渲染)后会触发componentDidMount(),可以在这里调用请求,进行DOM操作。
| 钩子函数 | 触发时机 | 作用 |
|---|---|---|
| constructor() | 创建组件时，最先执行 | 1. 初始化state 2. 创建Ref等 |
| render() | 每次组件渲染都会触发 | 渲染UI（注意： 不能调用setState() ） |
| componentDidMount | 组件挂载（完成DOM渲染）后 | 1. 发送网络请求 2.DOM操作 |
更新阶段
每当组件的状态或道具发生变化时
New props ;setate() ;forceUpdate()，组件就会更新并重新渲染,
componentDidUpdate()在更新后会被立即调用,首次渲染不会执行此方法,可以获取到更新后的DOM内容,不需要调用setState。
| 钩子函数 | 触发时机 | 作用 |
|---|---|---|
| render() | 每次组件渲染都会触发 | 渲染UI（与 挂载阶段 是同一个render） |
| componentDidUpdate() | 组件更新（完成DOM渲染）后 | DOM操作，可以获取到更新后的DOM内容，不需要调用setState() |
卸载阶段
当从组件中移除时会调用componentWillUnmount(),会在组件卸载及销毁之前直接调用。在此方法中执行必要的清理操作。
| 钩子函数 | 触发时机 | 作用 |
|---|---|---|
| componentWillUnmount() | 组件卸载（从页面中消失） | 执行清理工作（比如：清理定时器或取消网络请求等） |
运行阶段生命周期调用顺序
运行中阶段可以使用的函数 :
componentWillReceiveProps: 父组件修改属性触发,可以修改新属性,修改状态shouldComponentUpdate: 返回false会阻止render调用componentWillUpdate: 不能修改属性和状态render: 只能访问this.props和this.state,只有一个顶层组件,不允许修改状态和DOM输出componentDidUpdate: 可以修改DOM
