React Development Guides
  • React 开发指南
  • 说明
  • 1. 项目总览
    • 目录结构
    • 命名规范
  • 2. React 基础
    • JSX
    • 生命周期
    • 状态
    • 通信
    • 种类
    • 抽象
    • 事件
    • 样式
  • 3. 组件开发
    • UI组件
    • Redux 组件
      • contianer 组件
      • presentational 组件
    • 纯组件
      • PureRender
      • 组件提纯
    • 组件复用
      • Render Props
      • HOC
      • Hooks
    • Context
    • Portal
    • 性能分析
  • 4. 状态管理
    • Store
    • Reducer
    • Action
    • Selector
    • Middleware
    • Model
  • 5. 路由管理
    • Router
    • Route
    • Link
  • 6. 测试
    • 单元测试
    • 组件测试
    • 状态测试
  • 7. 安全规约
  • 附录A 参考资料
  • 附录B 常用网站
Powered by GitBook
On this page

Last updated 5 years ago

React < v16.3

  • 红色是在 v17 版本后废弃的生命周期。

  • 细字体的声明周期是不常用的，加粗是常用的。

React > v16.3

React v16.3，引入了两个新的生命周期函数：

  • getDerivedStateFromProps

  • getSnapshotBeforeUpdate

Tips：getDerivedStateFromProps 实际上就是用来取代以前的 componentWillMount 和 componentWillReceiveProps

随着 getDerivedStateFromProps 的推出，同时deprecate了一组生命周期API，包括：

  • componentWillReceiveProps

  • componentWillMount

  • componentWillUpdate

新的生命周期图如下图所示：

  • 细字体的声明周期是不常用的，加粗是常用的。

  • React < v16.3
  • React > v16.3
PreviousJSXNext状态
  1. 2. React 基础

生命周期

图：React < v16.3 生命周期图
图：React > v16.3 生命周期图