组件的生命周期分成三个状态
- Mounting：已插入真实 DOM
- Updating：正在被重新渲染
- Unmounting：已移出真实 DOM
Mounting(装载)
- getInitialState(): 在组件挂载之前调用一次。返回值将会作为 this.state 的初始值。
- componentWillMount()：服务器端和客户端都只调用一次，在初始化渲染执行之前立刻调用。不会触发再次渲染。
- componentDidMount()：在初始化渲染执行之后立刻调用一次，仅客户端有效（服务器端不会调用）,可以设置state，会触发再次渲染，组件内部可以通过
Updating (更新)
- componentWillReceiveProps(nextProps) 在组件接收到新的 props 的时候调用。在初始化渲染的时候，该方法不会调用。通常可以调用this.setState方法来比较this.props和nextProps的执行状态，完成对state的修改。在该函数中调用 this.setState() 将不会引起第二次渲染。
- shouldComponentUpdate(nextProps,nextState): 在接收到新的 props 或者 state，将要渲染之前调用。该方法用来拦截新的props或state，然后判断是否更新组件
该方法在初始化渲染的时候不会调用，在使用 forceUpdate 方法的时候也不会。如果确定新的 props 和 state 不会导致组件更新，则此处应该 返回 false。
- componentWillUpdate(nextProps, nextState)：在接收到新的 props 或者 state 之前立刻调用，即更新之前调用
在初始化渲染的时候该方法不会被调用。使用该方法做一些更新之前的准备工作。
注意：你不能在该方法中使用 this.setState()。如果需要更新 state 来响应某个 prop 的改变，请使用 componentWillReceiveProps。
- componentDidUpdate(prevProps, prevState): 在组件的更新已经同步到 DOM 中之后立刻被调用。
该方法不会在初始化渲染的时候调用。使用该方法可以在组件更新之后操作 DOM 元素。
Unmounting(移除)
- componentWillUnmount：在组件从 DOM 中移除的时候立刻被调用。
在该方法中执行任何必要的清理,收尾工作，比如无效的定时器，或者清除在 componentDidMount 中创建的 DOM 元素。
image
参考文章:
