react-生命周期

1.组件的生命周期可分成三个状态：

Mounting：已插入真实 DOM

Updating：正在被重新渲染

Unmounting：已移出真实 DOM

2.生命周期的方法有：

componentWillMount在渲染前调用,在客户端也在服务端。（过期？）

componentDidMount: 在第一次渲染后调用，只在客户端。之后组件已经生成了对应的DOM结构，可以通过this.getDOMNode()来进行访问。如果你想和其他JavaScript框架一起使用，可以在这个方法中调用setTimeout, setInterval或者发送AJAX请求等操作(防止异步操作阻塞UI)。  （常用）

componentWillReceiveProps在组件接收到一个新的 prop (更新后)时被调用。这个方法在初始化render时不会被调用。

shouldComponentUpdate返回一个布尔值。在组件接收到新的props或者state时被调用。在初始化时或者使用forceUpdate时不被调用。

可以在你确认不需要更新组件时使用。

componentWillUpdate在组件接收到新的props或者state但还没有render时被调用。在初始化时不会被调用。

componentDidUpdate在组件完成更新后立即调用。在初始化时不会被调用。（常用）

componentWillUnmount在组件从 DOM 中移除之前立刻被调用。（常用）

getDerivedStateFromProps在初始安装和后续更新上都在调用render方法之前立即调用。它应该返回一个对象以更新状态，或者返回null则不更新任何内容。

此方法适用于状态依赖于道具随时间变化的罕见用例。例如，实现一个比较其上一个和下一个子项以决定要对哪个子项进行动画处理的组件可能很方便。

---

3.React提供的这个ref属性，表示为对组件真正实例的引用，其实就是ReactDOM.render()返回的组件实例；

ReactDOM.render()渲染组件时返回的是组件实例；

渲染dom元素时，返回是具体的dom节点。

ref可以挂载到组件上也可以是dom元素上；

挂到组件(class声明的组件)上的ref表示对组件实例的引用。不能在函数式组件上使用 ref 属性，因为它们没有实例：

挂载到dom元素上时表示具体的dom元素节点。

ref属性可以设置为一个回调函数

React 支持给任意组件添加特殊属性。ref 属性接受一个回调函数，它在组件被加载或卸载时会立即执行。

当给 HTML 元素添加 ref 属性时，ref 回调接收了底层的 DOM 元素作为参数。

当给组件添加 ref 属性时，ref 回调接收当前组件实例作为参数。

当组件卸载的时候，会传入null

ref 回调会在componentDidMount 或 componentDidUpdate 这些生命周期回调之前执行。