react学习7-React 组件的生命周期

组件的生命周期

官方图解

React 组件的生命周期主要分为三部分：

• 组件创建阶段
• 组件更新阶段
• 组件销毁阶段

组件创建阶段(挂载)：

• constructor
  • 构造函数仅仅触发一次
  • 可以给组件的 this.state 赋值
• render
  • 数据(state和props)的变化会导致render重新执行
  • render方法触发后才会更新页面
  • 每次组件更新时 render方法都会被调用。
• componentDidMount
  • 组件完成挂载后触发（组件模板显示到页面后）
  • 一般用于初始化组件需要的数据（比如调用后台接口获取数据）

组件更新阶段：

• render
  • 只要state或者props任意一个发生变化就重新触发
• componentDidUpdate
  • 在组件已经被渲染到 DOM 中后运行
  • 组件依赖的数据更新时触发
    • 依赖的数据包括state和props的更新操作
  • 一般用于在数据更新时，手动更新相关信息（比如参数变化时重新调用后台接口）

组件销毁阶段：

• componentWillUnmount
  • 组件销毁时触发（组件从页面中移出）
  • 组件销毁时触发，一般用于销毁不再使用的资源，比如定时任务