About react-hooks
A guide to managing state and side effects with React Hooks, covering built-in and custom hooks alongside common rules. It is for React developers addressing dependencies, cleanup, and closure-related issues.
Key features
- 01Cover useState, useEffect, and useContext
- 02Include useRef, useMemo, and useCallback
- 03Explain useReducer and useLayoutEffect
- 04Describe custom hook naming and call rules
- 05Emphasize complete dependencies and cleanup
Use cases
- 01Manage component state and side effects with hooks
- 02Write reusable custom hooks
- 03Review dependency arrays and subscription cleanup
Install
Copy the command and run it in a terminal.
$
npx skills add https:/After installing, type/react-hooksin Claude Code to confirm it loaded.
Bundled filesagents/openai.yamlLICENSE.txt
Details
From the project READMEWhen to use this skill
Use this skill whenever the user wants to:
- 用 React Hooks（useState、useEffect、useContext、自定义）管理状态与副作用
- 遵循 Hooks 规则与最佳实践、避免闭包与依赖问题
How to use this skill
- 基础：useState、useEffect（依赖数组、清理函数）；useContext、useRef。
- 进阶：useMemo、useCallback、自定义 Hook；useReducer、useLayoutEffect。
- 参考：https://react.dev/reference/react
Best Practices
- 依赖数组完整；清理订阅与定时器。
- 自定义 Hook 命名 useXxx；避免条件/循环中调 Hook。
Keywords
React Hooks, useState, useEffect, 自定义 Hook
Comments
Markdown supported