react生命周期 (16.4前)

生命周期

react生命周期共分为4个阶段

1. 初始化阶段
2. 组件的挂载阶段
3. 组件的更新阶段
4. 组件的销毁阶段

初始化阶段

1. setup props and state

组件的挂载阶段

1. componentWillMount
   • 在挂载组件以前掉用,且只会调用一次，在这里面调用this.setState不会引发组件的从新渲染，也能够把写在这边的内容提早到constructor()中。 项目中不多用到
2. render
   • 根据组件的props和state渲染页面。不能在里面执行this.setState,会有改变组件状态的反作用
3. componentDidMount
   • 组件挂载到DOM后调用，且只会被调用一次

组件的更新阶段

组件的更新又分为两种，一种是props的更新，一种是state的更新

props
1. componentWillReceiveProps
    * 只调用于props引发的组件更新
    
state
1. shouldComponentUpdate
    * 是否继续更新，返回true表示当前组件将继续执行更新过程，返回false则中止当前更新，以此来减小组件没必要要的渲染，优化组件性能
2. componentWillUpdate
    * 在调用render前调用，能够作一些组件更新前的工做，通常不多用
3. render
    * 根据组件的props和state渲染页面。不能在里面执行this.setState,会有改变组件状态的反作用
4. componentDidUpdate
    * 在组件更新后调用，能够操做组件更新的DOM.

组件的销毁阶段

1. componentWillUnmount
   • 在组件被销毁的时候调用，能够在里面作一些销毁工做（清除定时器）