React Query useQuery
queryKey 工厂、无限列表、条件详情、乐观更新、缓存失效。
缓存面板
再点同一用户详情应立刻出现;失效/清空后才会重新转圈。
2
总查询
2
users 查询
fetching
当前状态
useInfiniteQuery 列表
加载中…
useQuery 详情(enabled)
点左侧用户查看详情。悬停会 prefetch。
useMutation 创建用户
useUsers / useInfiniteUsers / useUser 都走同一套 userKeys。改一条详情会invalidateQueries(lists),列表和无限滚动一起刷新;删除会先改 cache 再在失败时回滚。
这是客户端 Query Cache,和 /shop 的 Next.js Data Cache / 页面缓存不是一层。后者跨用户共享,这里只活在当前浏览器的 QueryClient 里。