Claude Code React Web 技能：新增记录后刷新 React Query 列表

Claude Code 安装步骤

从固定提交获取完整的 `skills/react-web` 目录。
复制到目标项目的 `.claude/skills/` 后核对 `.claude/skills/react-web/SKILL.md`。从项目根目录启动 Claude Code，直接描述符合该技能用途的任务。

把远端数据放进查询钩子，把写入放在变更钩子中。适合明确新增成功后应失效哪一个查询，并用测试验证界面刷新。

虚构的读书清单显示两条记录。新增第三条成功后，列表需要读回最新数据；失败时应保留旧列表。

成功时失效清单查询并显示第三条。失败时保留已有两条并显示反馈，避免把失败记录当成已保存。

GitHub 原文 · 更新日期 2026-11-13

Claude Code、固定版本技能及已经使用 TanStack React Query 的项目。测试使用项目现有工具。

先核对数据属于服务器还是本地界面。远端列表由查询缓存负责，局部界面状态另行处理。