React组件的生命周期

回顾前面的知识

  1. props只能进行数据传递,不能修改,并且只能通过父组件传给子组件;
  2. state(状态)用来保存交互的状态,每个组件自带state属性。不能在组件之间传递数据。
  3. 组件之间传值可以找到这些组件之间共有的父组件,把state属性设置在父组件上。
  4. react可以通过fetch()方法来完成ajax的异步提交。
  5. 组件生命周期前两种:
    • componentWillMount 组件渲染之前加载,在这个周期里边修改,不会进行再次渲染。
    • componentDidLMount 组件渲染之后加载,在这个周期里边修改,会进行再次渲染。

组件的生命周期

  1. componentWillReceiveProps (组件的props改变执行),有一个参数(newProps) 如果只改变当前组件的state,这个周期就不会执行。
  2. shouldComponentUpdate 只要属性props或state改变,都会执行。 返回值是一个布尔值,当返回值为true时执行后面的周期,返回值为false时不执行后面的周期。有两个参数(newprops, newState)。

在上面两个周期中都可以修改state。

  1. componentWillUpdate 组件即将修改事执行。不能在这个周期里边修改state,否则会陷入死循环。
  2. render 组件渲染
  3. componmentDidUpdate 组件修改后,这个周期里边也不能修改state。
  4. 最后一个生命周期,componmentWillUnmount 组件销毁后执行。

补充一个比较全面的组件声明周期的短文。

React组件的生命周期

一个组件就是一个状态机,对于特定的状态,他总是返回一致的输出。 组件的生命周期

实例化

● getDefaultProps :

对于组件类来说,这个方法只会执行一次。对于没有被父类组件置顶props属性的新建实例来说,这个方法返回的对象可用于为实例设置默认的props值。

● getInitialState :

对于组件的每个实例来说,这个方法调用次数有且只有一次。在这个方法里面,你可以初始化你的每个实例的state。与getDefaultProps方法不同