queryOptions

Function: queryOptions()

Allows to share and re-use query options in a type-safe way.

The queryKey will be tagged with the type from queryFn.

Example

ts
const { queryKey } = queryOptions({
  queryKey: ['key'],
  queryFn: () => Promise.resolve(5),
  //  ^?  Promise<number>
})

const queryClient = new QueryClient()
const data = queryClient.getQueryData(queryKey)
//    ^?  number | undefined
const { queryKey } = queryOptions({
  queryKey: ['key'],
  queryFn: () => Promise.resolve(5),
  //  ^?  Promise<number>
})

const queryClient = new QueryClient()
const data = queryClient.getQueryData(queryKey)
//    ^?  number | undefined

Param

The query options to tag with the type from queryFn.

queryOptions(options)

ts
function queryOptions<TQueryFnData, TError, TData, TQueryKey>(
  options,
): UndefinedInitialDataOptions<TQueryFnData, TError, TData, TQueryKey> & object
function queryOptions<TQueryFnData, TError, TData, TQueryKey>(
  options,
): UndefinedInitialDataOptions<TQueryFnData, TError, TData, TQueryKey> & object

Allows to share and re-use query options in a type-safe way.

The queryKey will be tagged with the type from queryFn.

Example

ts
const { queryKey } = queryOptions({
  queryKey: ['key'],
  queryFn: () => Promise.resolve(5),
  //  ^?  Promise<number>
})

const queryClient = new QueryClient()
const data = queryClient.getQueryData(queryKey)
//    ^?  number | undefined
const { queryKey } = queryOptions({
  queryKey: ['key'],
  queryFn: () => Promise.resolve(5),
  //  ^?  Promise<number>
})

const queryClient = new QueryClient()
const data = queryClient.getQueryData(queryKey)
//    ^?  number | undefined

Type Parameters

TQueryFnData = unknown

TError = Error

TData = TQueryFnData

TQueryKey extends QueryKey = QueryKey

Parameters

options: UndefinedInitialDataOptions<TQueryFnData, TError, TData, TQueryKey>

The query options to tag with the type from queryFn.

Returns

UndefinedInitialDataOptions<TQueryFnData, TError, TData, TQueryKey> & object

The tagged query options.

The tagged query options.

Param

The query options to tag with the type from queryFn.

Defined in

query-options.ts:52

queryOptions(options)

ts
function queryOptions<TQueryFnData, TError, TData, TQueryKey>(
  options,
): DefinedInitialDataOptions<TQueryFnData, TError, TData, TQueryKey> & object
function queryOptions<TQueryFnData, TError, TData, TQueryKey>(
  options,
): DefinedInitialDataOptions<TQueryFnData, TError, TData, TQueryKey> & object

Allows to share and re-use query options in a type-safe way.

The queryKey will be tagged with the type from queryFn.

Example

ts
const { queryKey } = queryOptions({
  queryKey: ['key'],
  queryFn: () => Promise.resolve(5),
  //  ^?  Promise<number>
})

const queryClient = new QueryClient()
const data = queryClient.getQueryData(queryKey)
//    ^?  number | undefined
const { queryKey } = queryOptions({
  queryKey: ['key'],
  queryFn: () => Promise.resolve(5),
  //  ^?  Promise<number>
})

const queryClient = new QueryClient()
const data = queryClient.getQueryData(queryKey)
//    ^?  number | undefined

Type Parameters

TQueryFnData = unknown

TError = Error

TData = TQueryFnData

TQueryKey extends QueryKey = QueryKey

Parameters

options: DefinedInitialDataOptions<TQueryFnData, TError, TData, TQueryKey>

The query options to tag with the type from queryFn.

Returns

DefinedInitialDataOptions<TQueryFnData, TError, TData, TQueryKey> & object

The tagged query options.

The tagged query options.

Param

The query options to tag with the type from queryFn.

Defined in

query-options.ts:85

Want to Skip the Docs?
Query.gg - The Official React Query Course
“This course is the best way to learn how to use React Query in real-world applications.”—Tanner Linsley
Get the course