React 常用 Hooks 速查

相关概念:react

常用 Hooks 可以先按职责来记,而不是按 API 列表硬背。

状态与数据

Hook作用
useState管理简单局部状态
useReducer管理带事件和状态转换的复杂状态
useContext读取上下文共享数据

副作用与引用

Hook作用
useEffect处理副作用和清理逻辑
useLayoutEffect处理需要在视觉更新前同步的副作用
useRef保存跨渲染周期稳定存在的引用

性能与封装

Hook作用
useMemo缓存派生值
useCallback缓存函数引用
useImperativeHandle向父组件暴露受控的实例能力

一个判断

如果某个 Hook 的引入没有明确解决状态、依赖或性能边界,通常只是把代码复杂度提前了。

结论

先按职责记 Hook,比按名称罗列更容易形成稳定心智模型。