SuperAPI AI 工具集

reause-functions

前端与建站

查看项目

更新于 10-15 22:11

技能介绍

用途:本技能是 React 项目中使用 reause 函数的决策与实现指南,帮助把需求映射到最合适的 reause 函数,并采用正确调用方式,优先用 Hook 方案替代自写代码。

主要能力:reause 是 VueUse 的 1:1 React 移植,上游 composable 对应单个 reause 函数,选项相同、返回结构适配 React。命名映射:ref* → useState*(如 refDebounced → useStateDebounced);on* → use*(如 onClickOutside → useClickOutside);useRefHistory → useStateHistory。只读值源接收普通 T,需要回写的值接收 React 状态元组 State<T>(如 useState<T>())。函数按类别组织:状态(useLocalStorage、useMap、useSet、useStateHistory 等)、元素(useElementSize、useIntersectionObserver、useDraggable 等)、浏览器(useClipboard、useDark、useFullscreen、useWebSocket 等)、传感器(useMouse、useHotkeys、useGeolocation、useSwipe 等)、网络(useFetch、useEventSource)、动画(useIntervalFn、useRafFn、useTransition 等)、组件(useVirtualList、useMounted 等)、监听(useWatch 系列)、响应式(syncState、useAsync 等)、数组(useArrayFilter、useSorted 等)、时间(useCountdown、useDateFormat、useTimeAgo 等)与工具(createEventHook、useAsyncQueue 等)。

使用方式:在 React 开发中先检查是否有 reause 函数可实现需求,优先使用 Hook。调用规则见函数表 Invocation 字段:AUTO 表示适用时自动使用;EXTERNAL 表示仅在用户已安装所需外部依赖时使用,否则重新考虑,确有必要才请求安装;EXPLICIT_ONLY 表示仅在用户明确要求时使用。提示词或 AGENTS.md 中的用户指令可覆盖默认调用规则。使用任一函数时应查阅 ./references 中对应文档以获取用法与类型声明。函数从 @reause/core、@reause/shared 等包导出。

适用场景:React 项目中需要状态、DOM 元素、浏览器 API、传感器、网络、动画、数组与时间等常见能力时。

限制:资料未提供安装命令、版本、收费、平台与效果信息;各函数具体用法与类型需查阅对应参考文档。