SuperAPI AI 工具集

hooks

前端与建站

查看项目

更新于 10-16 04:22

技能介绍

本资料为 inbox-zero 项目中关于自定义 React hooks 的编写规范,属于项目内部的开发约定,用于统一可复用逻辑与数据获取的实现方式。

用途 该规范用于指导在项目内创建自定义 React hooks,目的是封装可复用的有状态逻辑,尤其针对数据获取或复杂 UI 交互场景。通过遵循统一约定,保证应用内可复用逻辑与数据获取方式的一致性。

主要能力与要求

  1. 位置:自定义 hooks 应放置在 apps/web/hooks/ 目录下。
  2. 命名:使用 use 前缀,例如 useAccounts.ts。
  3. 数据获取:从 API 端点获取数据时,优先使用 useSWR,并遵循 data-fetching.mdc 中列出的指引。
  4. 专用 hooks:为特定数据类型创建专用 hooks,例如 useAccounts、useLabels。
  5. 典型结构:hook 通常应包装 useSWR,处理 API 端点 URL,并返回数据、加载状态、错误状态,以及可能的 SWR mutate 函数。
  6. 简洁性:保持 hooks 聚焦于单一职责。

使用方式 在项目开发中新增自定义 hook 时,按上述位置、命名和数据获取约定编写代码;涉及 API 数据获取时优先采用 useSWR 并参考 data-fetching.mdc。

适用场景 适用于 inbox-zero 项目内部需要封装可复用状态逻辑、数据获取逻辑或复杂 UI 交互逻辑的前端开发场景。

限制 资料未提供具体的代码示例、依赖版本、安装命令、收费或价格信息,也未说明该规范适用的 React 版本或 useSWR 的具体配置细节。