记录下学习历程2

最新生命周期(React-16)

1、Mounting（加载阶段）

2、Updating（更新阶段）

3、Unmounting（卸载阶段）

Mounting加载阶段（涉及6个钩子函数）

constructor()

加载的时候调用一次，可以初始化state；

getDefaultProps()

设置默认的props，也可以用defaultProps设置组件的默认属性。

getInitialState()

初始化state，可以直接在constructor中定义this.state

componentWillMount()

组件加载时只调用，以后组件更新不调用，整个生命周期只调用一次，此时可以修改state

render()

react最重要的步骤，创建虚拟dom，进行diff算法，更新dom树

componentDidMount

组件渲染之后调用，只调用一次

Updating(更新阶段：涉及5个钩子函数)

componentWillReceiveProps（nextProps）

组件加载时不调用，接收传入新的props

shouldComponentUpdate(nextProps, nextState)

组件接收到新的props或者state时调用，return true就会更新dom（使用diff算法更新），return false能阻止更新（不调用render）

componentWillUpdata(nextProps, nextState)

组件加载时不调用，只有在组件将要更新时才调用，此时可以修改state

render（）

创建虚拟dom，进行diff算法

componentDidUpdate()

组件加载时不调用，组件更新完成后调用。

Unmounting（卸载阶段：涉及1个钩子函数）

componentWillUnmount（）

组件渲染之后调用，只调用一次

新的生命周期

Mounting(加载阶段：涉及4个钩子函数)

constructor()

加载的时候调用一次，初始化state调用

static getDerivedStateFromProps(props,state)

组件每次被render的时候，包括在组件构建之后（虚拟dom之后，实际dom挂载之前），每次获取新的props或state之后，每次接收新的props之后都会返回一个对象作为新的state，返回null说明不需要更新state；配合componentDidUpdate,可以覆盖componentWillReceiveProps的所有用法。

render()

react最重要的一步，创建虚拟dom,进行diff算法，更新dom树都在此进行。

componentDidMount()

组件渲染之后调用，只调用一次

记录下学习历程2

原文：https://www.cnblogs.com/jiadaxiadedaimashenghuo/p/12421706.html