React的生命周期

react的生命周期总共分3种情况

  • 页面第一次渲染的时候以下几个方法依次调用
    1、static defaultProps = { autoPlay: false, maxLoops: 10 };
    2、constructor 初始化
    3、componentWillMount 渲染之前调用
    4、render 开始渲染页面
    5、componentDidMount 页面渲染完成之后调用

  • 每次修改 state,都会重新渲染组件,会依次调用下列方法:
    1、shouldComponentUpdate 通过返回值得true和false来判断是否重新渲染页面
    2、componentWillUpdate 组件重新渲染之前调用
    3、render 组件渲染
    4、componentDidUpdate 组件重新渲染之后调用

  • 每次修改props的时候,会触发下面生命周期函数的调用
    1、componentWillReceiveProps 父组件修改子组件的props之后调用,使页面重新渲染
    2、shouldComponentUpdate 通过返回值得true和false来判断是否重新渲染页面
    3、componentWillUpdate 组件重新渲染之前调用
    4、render 组件渲染
    5、componentDidUpdate 组件重新渲染之后调用

你可能感兴趣的:(React的生命周期)