建期

componentWillMount 组件Dom创建之前

这个方法正确调用的时候是在component第一次render之前, 所以第一眼看上去觉得就应该在这里去请求数据
但是这里有个问题, 在异步请求数据中这一次返回的是空数据, 因为是在’render’之前不会返回数据. 所以在渲染的时候没有办法等到数据到来,也不能在componentWillMount中返回一个Promise(因为Promise的特性之一就是状态不可变),或者用setTimeout也是不适合的.正确的处理方式就不要在这里请求数据,而是让组件的状态在这里正确的初始化.

顺便说一句在es6中,使用extend component的方式里的constructor函数和componentWillMount是通用的作用,所以你在构造函数里初始化了组件的状态就不必在WillMount做重复的事情了.

componentDidmount 组件dom创建完成

omponentDidMount呢?这个生命周期函数在是在render之后调用一次,component已经初始化完成了.

在生产时,componentDidMount生命周期函数是最好的时间去请求数据,其中最重要原因:使用componentDidMount第一个好处就是这个一定是在组件初始化完成之后,再会请求数据,因此不会报什么警告或者错误,我们正常请教数据完成之后一般都会setState.

存在期

componentWillReceiveProps 组件接受新的props数据之前

该方法当props发生变化时执行，初始化render时不执行，在这个回调函数里面，你可以根据属性的变化，通过调用thi.setState()来更新你的组件状态，旧的属性还是可以通过this.props来获取,这里调用更新状态是安全的，并不会触发额外的render调用

showldComponentUpdate 组件是否更新

这个函数可以接受三个参数分别是nextProps,nextState,nextContext，此函数可以省略不写，但是如果写就必须返回一个boolean，这点跟其他周期函数不同。我们可以利用这个函数对组件前后历史的数据进行对比从而实现组件性能优化，就是说通过对比发现数据没有真正更新就阻止周期函数继续运行，如果过发现数据有更新则允许周期继续运行。但需要提醒的是，该函数虽然可以用来做优化，如果不是确定能带来优化效果，尽量不要人为设置，react自身的性能就已经很高，应该优先考虑利用react自身的能力。

componentWillUpdate 组件更新之前

componentDidUpdate 组建更新之后

销毁期

componentWillUnmount 组件即将销毁
在这个函数，我们要做

  1. 移除定时器和事件

定时器和事件并没有绑定组件上，所以组件销毁后，还在执行，就会报错

  1. 做ajax的兼容，防止内存泄漏

网页发出请求,在请求数据还未回来的时候,跳到另一页面,数据回来之后会setstate,这样就会导致内存泄露

render 渲染阶段
constructor 初始化阶段