React的生命周期?

React的生命周期分为三个主要阶段:挂载(Mounting)、更新(Updating)和卸载(Unmounting)。

1、挂载(Mounting)

当组件实例被创建并插入 DOM 时调用的生命周期方法:

constructor()

static getDerivedStateFromProps()

render()

componentDidMount()

2、更新(Updating)

当组件的状态或属性发生变化时调用的生命周期方法:

static getDerivedStateFromProps()

shouldComponentUpdate()

render()

getSnapshotBeforeUpdate()

componentDidUpdate()

3、卸载(Unmounting)

当组件从 DOM 中移除时调用的生命周期方法:

componentWillUnmount()

其他

componentDidCatch() 和 static getDerivedStateFromError() 用于错误边界。

这些生命周期方法让开发者可以在不同阶段插入自定义逻辑,增强组件的行为和性能。

相关推荐
sakiko_8 分钟前
Swift学习笔记39-实战注意事项
前端·笔记·学习·swift
海带紫菜菠萝汤8 分钟前
MSE (Media Source Extensions) 实战:流媒体分块加载与自适应码率
前端·javascript·音视频
@小匠14 分钟前
Spring Boot Nacos绑定 Map 时中文 key 导致启动失败:一次从复现到源码的排查实录
java·开发语言·前端
黄华SJ520it18 分钟前
顶俏洗衣液模式制度开发介绍:S2B2C社交分销+多门店核销系统全解析
前端·数据库·小程序·零售·系统开发
张元清42 分钟前
React useMount Hook:只在挂载时执行一次的正确姿势 (2026)
javascript·react.js
晓说前端44 分钟前
TypeScript 核心语法应用 —— Vue 3 中的使用(上)
前端·typescript
breeze jiang1 小时前
JavaScript 单例模式:用静态属性保证 Popup 只创建一次
开发语言·javascript·单例模式
No Silver Bullet1 小时前
Vue进阶(贰幺叁)vue.config.js 中 productionSourceMap 作用详解
前端·javascript·vue.js
xcsweb1 小时前
从5分钟到10秒:我用一个Skill把团队部署效率提升了30倍
前端·vue.js
用户62960593247051 小时前
一次位置调整引发的画布失忆:深入 Vue2 虚拟 DOM 复用机制
前端·vue.js