跳转到内容

Migration: client.query -> defineQuery/observeQuery

把“定义缓存”和“订阅视图”分开:

  • 缓存级:defineQuery(key/queryFn/stale/retry/gc)
  • 观察者级:observeQuery(enabled/select/placeholder/refetchOn*)
const user = client.query({
key: ['user', id],
queryFn: ({ signal }) => fetchUser(id, signal),
});
await user.fetch();
const userQuery = client.defineQuery({
key: ['user', id],
queryFn: ({ signal }) => fetchUser(id, signal),
});
const userObserver = client.observeQuery({
query: userQuery,
enabled: true,
refetchOnMount: 'stale',
});
await userQuery.fetch();
  • invalidateQueries:保留
  • cancelQueries:保留
  • removeQueries:保留
  • 新增:refetchQueriesresetQueriessetQueriesData
const dehydrated = client.dehydrate();
client.hydrate(dehydrated);

useQuery 调用方式保持接近,但建议显式传 query 句柄以消除定义歧义:

const userQuery = client.defineQuery({
key: ['user', id],
queryFn: ({ signal }) => fetchUser(id, signal),
});
const user = useQuery({
client,
query: userQuery,
select: (value) => value,
});