react生命周期函数

什么是生命周期函数

生命周期函数指在组件运行的某一个时刻会自动调用执行的函数。

生命周期函数图
  • initialization(constructor中做页面的props和state的一些配置)

页面初始化的时候执行。

  • Monuting (组件第一次将被挂载在页面中)

ComponentWillMount 在组件即将被挂载到页面时立刻执行。
render 页面挂载的时候执行。
ComponentDidMount 页面挂载之后执行。
tips: ComponentWillMountComponentDidMount只会在第一次挂载的时候执行。

  • Updation(组件发生更新的时候执行主要包含propsstates的变化)

shouldComponentUpdate 组件被更新之前,它会自动执行,结果返回一个布尔值,如果返回false,则组件不会往下执行。
componentWillUpdate 组件被更新之前,它会自动执行,但是它在shouldComponentUpdate之后执行,执行的前提条件为shouldComponentUpdate返回true。
render 数据发生改变,虚拟dom开始更新,页面重新渲染
componentDidUpdate 组件更新完成之后执行
componentWillReceivProps 主要发生在子组件,执行有2个前提:1、一个组件要从父组件接受参数。2、只要父组件的render函数被重新执行了,子组件的这个生命周期函数就会被执行(这个组件第一次存在于父组件中不会执行,只有当它已经存在于父组件中才会执行)。

  • Unmounting

componentWillUnmount 当这个组件即将被页面中剔除的时候,就会执行。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容