求求你别用 useEffect 做数据请求了
来源：dev.to — Jul 25-26
📋 概述
作者用凌晨两点盯着屏幕 debug 的场景开场，详细拆解了在 React 中用 useEffect 做数据请求的四大痛点：重复请求、竞态条件、加载状态混乱、缓存缺失。随后给出了三条现代化替代路径：React Query/TanStack Query、SWR、以及 React 19 的 use() hook 与 Suspense 组合。
🔑 核心要点
- useEffect 中的竞态条件是最隐蔽的 Bug——组件快速挂载卸载时，旧的网络响应可能覆盖新请求的数据。
- TanStack Query 不是简单包装 fetch，它是一整套异步状态管理方案：缓存、去重、后台刷新、乐观更新。
- React 19 的 use() hook 可以直接 unwrap Promise 并与 Suspense 配合，将数据请求从 Effect 中彻底搬出。
💡 金句
凌晨两点，你在调试为什么面板数据闪烁了三帧又消失了。而原因仅仅是你还在用 useEffect 做 fetch。
👍 0
👎 0
← 返回 Dev.to 首页