查询选项
在多个位置之间共享 queryKey 和 queryFn，同时又让它们彼此保持共置（co-located）的最佳方式之一是使用 queryOptions 辅助函数。在运行时，该辅助函数仅返回你传入的任何内容，但 配合 TypeScript 使用时，它具备诸多优势：你可以在一个地方定义查询的所有可能选项，并且能为所有这些选项获得类型推断和类型安全。
TypeScript
1import { queryOptions } from '@tanstack/vue-query'2 3function groupOptions(id: number) {4 return queryOptions({5 queryKey: ['groups', id],6 queryFn: () => fetchGroups(id),7 staleTime: 5 * 1000,8 })9}10 11// usage:12 13useQuery(groupOptions(1))14useSuspenseQuery(groupOptions(5))15useQueries({16 queries: [groupOptions(1), groupOptions(2)],17})18queryClient.query(groupOptions(23))19queryClient.setQueryData(groupOptions(42).queryKey, newGroups)对于无限查询（Infinite Queries），还提供了一个单独的 infiniteQueryOptions 辅助函数。
你仍可在组件级别覆盖部分选项。一种非常常见且实用的模式是为每个组件创建专属的 select 函数：
TypeScript
1// Type inference still works, so query.data will be the return type of select instead of queryFn2 3const query = useQuery({4 ...groupOptions(1),5 select: (data) => data.groupName,6})