SuperAPI AI 工具集

lov-install-tanstack-query

编程与开发

查看项目

更新于 10-16 00:01

技能介绍

用途:把 TanStack Query 引入前端项目,或将现有请求状态重构为共享的 query/mutation 层。适用于用户要求安装/初始化 TanStack Query(React Query)、项目存在重复的 useEffect + useState + fetch/invoke 请求代码、希望网络读取统一共享缓存与失效行为、Tauri 应用中大量 invoke() 读取需要当作服务端状态,或用户提及 RTK Query 但项目偏好 TanStack Query 的场景。

主要能力与流程:先读取本地规则与项目结构(pwd、find .. -name AGENTS.md -print、rg 检索相关依赖与调用),遵守项目约束。把请求代码分为三类:服务端读取用 useQuery,服务端写入用 useMutation,命令式副作用(终端 I/O、文件打开、剪贴板、重启应用、安装进度、流式通道)通常不纳入。仅在 package.json 缺少依赖时安装,命令保持为 pnpm add @tanstack/react-query、npm install @tanstack/react-query、yarn add @tanstack/react-query、bun add @tanstack/react-query;持久化或开发工具仅在项目已使用或用户明确要求时添加。在应用根部添加一个 QueryClientProvider,并提供默认选项(如 staleTime: Infinity、refetchOnWindowFocus: false、retry: false,可按需调整)。建议创建小型本地封装与稳定 query keys,例如 Tauri 场景封装 useInvokeQuery/useInvokeMutation,REST 场景包装现有 API 客户端;onSuccess 中按传入的 invalidateKeys 失效查询。重构从重复且用户可见的请求开始,乐观更新可用 queryClient.setQueryData(),本地 UI 状态(弹窗、表单草稿、选中标签、筛选)保留在本地,不破坏已有流式订阅。最后运行仓库允许的最轻检查,如 pnpm exec tsc --noEmit --pretty false、npm run typecheck、yarn typecheck、bun run typecheck,若本地规则禁止则不运行重型构建或开发服务器。

限制说明:资料未提供收费、价格、平台支持范围与效果承诺等信息;实际默认值与封装方式需按项目架构和产品需求调整。