---
id: shared-hooks
name: 共享 React Hooks
area: shared
status: concept
---

## 概述

跨 app 复用的 React 自定义 Hooks，以 packages/hooks 形式发布。依赖 React，不依赖具体 UI 框架。

## 任务卡

### 💭 搭建 hooks 库骨架
- status: concept
- complexity: S
- files: packages/hooks/package.json, packages/hooks/src/index.ts
- acceptance: packages/hooks 可被 workspace 内任意 React 应用通过 @repo/hooks 引入，peer dependency 声明 react

### 💭 数据请求 Hook（useRequest）
- status: concept
- complexity: M
- files: packages/hooks/src/useRequest.ts
- acceptance: 支持 loading/data/error 三态，支持手动触发和依赖自动触发，支持取消请求（AbortController）

### 💭 移动端交互 Hooks
- status: concept
- complexity: M
- files: packages/hooks/src/useTouch.ts, packages/hooks/src/useScrollLock.ts, packages/hooks/src/useVirtualKeyboard.ts
- acceptance: useTouch 处理 swipe 手势，useScrollLock 控制 body 滚动，useVirtualKeyboard 检测键盘弹出并调整视口

### 💭 持久化状态 Hook（useLocalStorage）
- status: concept
- complexity: S
- files: packages/hooks/src/useLocalStorage.ts
- acceptance: 封装 useState + localStorage 同步，支持 SSR 安全（无 window 时优雅降级），TypeScript 泛型