upstream-tanstack-query/docs/framework/solid/guides/query-options.md

id, title, ref, replace

id	title	ref	replace
query-options	Query Options	docs/framework/react/guides/query-options.md	@tanstack/react-query useMutationState[(] useMutation[(] useQuery[(] useQueries[(] useInfiniteQuery[(] @tanstack/solid-query useMutationState(() => useMutation(() => useQuery(() => useQueries(() => useInfiniteQuery(() =>

import { queryOptions } from '@tanstack/solid-query'

function groupOptions(id: number) {
  return queryOptions({
    queryKey: ['groups', id],
    queryFn: () => fetchGroups(id),
    staleTime: 5 * 1000,
  })
}

// usage:

useQuery(() => groupOptions(1))
useQueries(() => ({
  queries: [groupOptions(1), groupOptions(2)],
}))
queryClient.query(groupOptions(23))
queryClient.setQueryData(groupOptions(42).queryKey, newGroups)

You can still override some options at the component level. A very common and useful pattern is to create per-component select functions:

// Type inference still works, so query.data will be the return type of select instead of queryFn

const groupQuery = useQuery(() => ({
  ...groupOptions(1),
  select: (data) => data.groupName,
}))