重要前提
安装AI Skills的关键前提是:必须科学上网,且开启TUN模式,这一点至关重要,直接决定安装能否顺利完成,在此郑重提醒三遍:科学上网,科学上网,科学上网。查看完整安装教程 →
ahooks by whinc/my-claude-plugins
npx skills add https://github.com/whinc/my-claude-plugins --skill ahooks此技能提供关于 ahooks React hooks 库的全面专业知识,涵盖所有 76+ 个 hooks,包含详细的文档、示例和最佳实践。
import { useRequest, useMount, useSetState } from 'ahooks';
const MyComponent = () => {
const { data, loading, error } = useRequest('/api/data');
const [state, setState] = useSetState({ count: 0 });
useMount(() => {
console.log('Component mounted');
});
return <div>{data}</div>;
};
useSetState、useToggle、useBoolean 用于复杂状态useRequest 用于带缓存、重试、轮询的 API 调用useDebounce、 用于优化广告位招租
在这里展示您的产品或服务
触达数万 AI 开发者,精准高效
useThrottleuseMount、useUnmount、useUpdateEffect 用于组件生命周期此技能将 hooks 分为 9 个主要类别:
用于复杂状态处理的状态工具。参见: state-hooks.md
组件生命周期和副作用管理。参见: effect-hooks.md
API 调用、分页、无限滚动和数据缓存。参见: request-hooks.md
防抖、节流、记忆化和 RAF 优化。参见: performance-hooks.md
事件监听器、尺寸、滚动和 UI 交互。参见: dom-hooks.md
本地存储、会话存储、Cookie 和 URL 状态。参见: dom-hooks.md
网络状态、可见性、键盘事件和浏览器功能。参见: dom-hooks.md
间隔、超时和倒计时工具。参见: advanced-hooks.md
WebSockets、历史管理、响应式数据和复杂模式。参见: advanced-hooks.md
// 最常用的 hooks
import {
useRequest, // 数据获取
useMount, // 组件挂载
useUnmount, // 组件卸载
useSetState, // 状态管理
useDebounce, // 性能优化
useThrottle, // 性能优化
useEventListener // DOM 事件
} from 'ahooks';
每周安装量
50
代码仓库
GitHub 星标数
10
首次出现
2026年1月24日
安全审计
安装于
gemini-cli39
codex39
opencode39
github-copilot37
kimi-cli35
amp35
This skill provides comprehensive expertise for the ahooks React hooks library, covering all 76+ hooks with detailed documentation, examples, and best practices.
import { useRequest, useMount, useSetState } from 'ahooks';
const MyComponent = () => {
const { data, loading, error } = useRequest('/api/data');
const [state, setState] = useSetState({ count: 0 });
useMount(() => {
console.log('Component mounted');
});
return <div>{data}</div>;
};
useSetState, useToggle, useBoolean for complex stateuseRequest for API calls with caching, retry, pollinguseDebounce, useThrottle for optimizationuseMount, useUnmount, useUpdateEffect for component lifecycleThis skill organizes hooks into 9 main categories:
State utilities for complex state handling. See: state-hooks.md
Component lifecycle and effect management. See: effect-hooks.md
API calls, pagination, infinite scroll, and data caching. See: request-hooks.md
Debounce, throttle, memoization, and RAF optimizations. See: performance-hooks.md
Event listeners, sizing, scrolling, and UI interactions. See: dom-hooks.md
Local storage, session storage, cookies, and URL state. See: dom-hooks.md
Network status, visibility, keyboard events, and browser features. See: dom-hooks.md
Intervals, timeouts, and countdown utilities. See: advanced-hooks.md
WebSockets, history management, reactive data, and complex patterns. See: advanced-hooks.md
// Most commonly used hooks
import {
useRequest, // Data fetching
useMount, // Component mount
useUnmount, // Component unmount
useSetState, // State management
useDebounce, // Performance
useThrottle, // Performance
useEventListener // DOM events
} from 'ahooks';
Weekly Installs
50
Repository
GitHub Stars
10
First Seen
Jan 24, 2026
Security Audits
Gen Agent Trust HubPassSocketPassSnykWarn
Installed on
gemini-cli39
codex39
opencode39
github-copilot37
kimi-cli35
amp35
React视图过渡API使用指南:实现原生浏览器动画与状态管理
8,400 周安装
加密货币市场情绪分析工具 - 聚合RSS新闻并计算情绪分数
316 周安装
React Three Fiber 纹理加载教程:useTexture Hook 与 useLoader 完整指南
317 周安装
技术债务分析与修复指南:识别、量化、优先处理代码重构与优化
315 周安装
Slack GIF 创建工具 - 优化尺寸、帧率、颜色数,生成符合 Slack 要求的动态表情符号
313 周安装
React Native与Expo移动开发专家 | 跨平台iOS/Android应用开发与优化
313 周安装
GrepAI 快速入门:5分钟安装配置,实现代码语义搜索与智能分析
316 周安装