React组件生命周期总结

生命周期函数是什么？ 通俗的说就是在某一时刻会被自动调用执行的函数。

react的生命周期可以分成四个部分：
1.初始化

在这里可以初始化props,state

2.挂载

⑴ componentWillMount():

   在组件挂载到DOM前调用，且只会被调用一次

⑵ componentDidMount()：

  组件被挂载到页面之后调用，此时组件拥有一个 DOM 展现，可以通过 this.getDOMNode() 来获取相应 DOM 节点。

3.更新

⑴ componentWillReceiveProps(nextprops):

  组件从父组件中接受了新的props并且组件已经存在时调用,此方法可以作为 react 在 prop 传入之后， render() 渲染之前更新 state 的机会。

⑵ shouldComponentUpdate(nextprops,nextstate):

  组件在接收到新的 props 或者 state，将要渲染之前调用。函数会返回一个布尔值，true才会更新组件。

⑶ componentWillUpdate(nextprops,nextstate):

  组件更新之前时调用。

⑷ componentDidUpdate():

  在组件的更新已经同步到 DOM 中之后立刻被调用。

4.卸载

⑴ componentWillUnmount():

  组件即将被卸载时执行

参考 ： 《React进阶之路》