react 生命周期

1、void constructor函数,构造函数,后面的博文会仔细研究该函数。

2、void componentWillMount();

组件初始化会执行这个函数,字面意思是组件将要挂载了,这个函数只在组件挂载前执行,在以后的更新渲染过程中并不参与,重要的是在这个函数内进行ajax请求后台的数据,然后调用setState进行渲染并不会去调用更新函数,这里的好处是不会因为setState而影响初始化的过程。

3、render

react的核心的函数,通过return进行界面渲染,千万不要在此处调用setState或者其他重新渲染的函数,否则。。死循环。

4、void componentDidMount();

也是组件初始化会调用该函数,但是和 componentWillMount不同的是此处执行setState会调用更新函数,所有界面数据请求还是写在componentWillMount中效率高。

5、void componentWillUnmout();

组件卸载函数,说是卸载,但是如果刷新浏览器或者关闭浏览器都不会执行该函数,初步研究是在组件被替换后执行。

6、void componentWillReceiveProps(props);

在这里把拥有这些函数的组件称为子组件而把这个组件被引用的组件称为父组件,该子组件被引用是可以有些属性的,这些组件是父子间对话的通道,父组件可以向子组件传值,子组件可以调用父组件的方法来到达子向父传值。当父组件的render函数重新执行时会调用子组件的 componentWillReceiveProps的这个方法,这里注意父组件初始化时并不会调用这个方法,当父组件更新时才会调,还有个需要注意的是只有该子组件是静态加载时才会有调这个方法的可能,静态的意思是在父组件的render函数中而不是通过父组件的setState去加载。

**********现在开始刨坑,在componentWillReceiveProps中接受的参数props是更新后的,然后此时如果获取this.props的话会发现props没有更新,或者在componentWillReceiveProps调用的函数中用this.props中都会发现没有更新,据此可以猜测this.props是执行完componentWillReceiveProps后更新的。

7、void componentShouldUpdate(props,state);

在任何更新前都会执行这个函数,作用是判断是否执行更新,做法是通过返回true来执行更新false阻止更新,目前还没有用到过阻止更新的。。。但愿也用不到。

8、void componentWillUpdate();

字面意思是组件将更新,在 componentShouldUpdate 返回true后会执行该函数。

9、void componentDidUpdate();

组件更新完后会执行该函数。