React的生命周期

生命周期

人类的生命周期是:生 -> 老 -> 病 -> 死。

其实每个组件都有自己的“生命周期”,一个组件都经历了,运行和完成,那么React组件的生命周期是什么呢?

React 的生命周期包括三个阶段:mount(挂载)、update(更新)和 unmount(移除)

mount(挂载)

mount就是第一次让组件出现在页面周的过程。这个过程的关键就是render方法。React 会将 render 的返回值(一般是虚拟DOM,也可以事DOM或者null)插入到页面中。

这个期间,会有几个hook方便你往里面加代码:

  1. constructor()
    2.componentWillMount()
    3.render()
    4.componentDidMount()
    img

update(更新)

mount 之后,如果数据有任何变动,就会来到update过程,这个过程会出现五个hook:

1.componentWillReceiveProps(nextProps) -读取props
2.shouldComponentUpdate(nextProps, nextState) -是否需要更新组件
3.render() -进行更新
4.componentDidUpdate() -更新完毕

unmount(卸载)

当一个组件将要从页面移除的时候,会进入unmount过程,这个过程就只有一个hook:
1.componentWillUnmount() -移除组件前你可以进行的活动