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() 用于错误边界。

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

相关推荐
大家的林语冰15 小时前
前端周刊:axios 疑遭朝鲜黑客“钓鱼“;CSS 新函数上线;npm 上线深色主题;Oxlint 兼容表;ESLint 支持 Temporal......
前端·javascript·css
哀木17 小时前
一个简单的套壳方案,就能让你的 Agent 少做重复初始化
前端
问心无愧051317 小时前
ctf show web入门27
前端
小村儿17 小时前
给 AI Agent 装上"长期记忆":Karpathy 的 LLM Wiki 思想,我做成了工具
前端·后端·ai编程
竹林81817 小时前
用ethers.js连接MetaMask实现Web3钱包登录:从踩坑到稳定运行的完整记录
前端·javascript
heyCHEEMS17 小时前
如何用 Recast 实现静态配置文件源码级读写
前端·node.js
心连欣17 小时前
从零开始,学习所有指令!
前端·javascript·vue.js
review4454317 小时前
大模型和function calling分别是如何工作的
前端
东东同学17 小时前
耗时一个月,我把 Nuxt 首屏性能排障经验做成了一个 AI Skill
前端·agent
冴羽18 小时前
超越 Vibe Coding —— AI 辅助编程指南
前端·ai编程·vibecoding