4.9 KiB
id, title
| id | title |
|---|---|
| infiniteQueryOptions | infiniteQueryOptions |
Call Signature
function infiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>(options): UndefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData, unknown>, TError>;
Defined in: packages/vue-query/src/infiniteQueryOptions.ts:99
You can generally pass everything to infiniteQueryOptions that you can also pass to useInfiniteQuery.
These options can be shared across hooks and imperative APIs such as queryClient.infiniteQuery.
options.queryKey is required and is the query key to generate options for.
Type Parameters
TQueryFnData
TQueryFnData
TError
TError = Error
TData
TData = InfiniteData<TQueryFnData, unknown>
TQueryKey
TQueryKey extends readonly unknown[] = readonly unknown[]
TPageParam
TPageParam = unknown
Parameters
options
UndefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>
The UndefinedInitialDataInfiniteOptions to use — everything you can pass to
useInfiniteQuery.
Returns
UndefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData, unknown>, TError>
The same options object, typed so that queryKey carries the inferred data type.
See
useInfiniteQuery to run an infinite query with these options.
Example
<script setup lang="ts">
import { infiniteQueryOptions, useInfiniteQuery } from '@tanstack/vue-query'
const projectsOptions = infiniteQueryOptions({
queryKey: ['projects'],
queryFn: ({ pageParam }) => fetchProjects(pageParam),
initialPageParam: 0,
getNextPageParam: (lastPage) => lastPage.nextId,
})
const { data, isError, error, fetchNextPage } = useInfiniteQuery(projectsOptions)
</script>
Call Signature
function infiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>(options): DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData, unknown>, TError>;
Defined in: packages/vue-query/src/infiniteQueryOptions.ts:153
You can generally pass everything to infiniteQueryOptions that you can also pass to useInfiniteQuery.
These options can be shared across hooks and imperative APIs such as queryClient.infiniteQuery.
options.queryKey is required and is the query key to generate options for.
This overload is selected when initialData is set, so the resulting data is never undefined.
Type Parameters
TQueryFnData
TQueryFnData
TError
TError = Error
TData
TData = InfiniteData<TQueryFnData, unknown>
TQueryKey
TQueryKey extends readonly unknown[] = readonly unknown[]
TPageParam
TPageParam = unknown
Parameters
options
DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>
The DefinedInitialDataInfiniteOptions to use — everything you can pass to
useInfiniteQuery, with initialData set.
Returns
DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData, unknown>, TError>
The same options object, typed so that queryKey carries the inferred data type.
See
useInfiniteQuery to run an infinite query with these options.
Example
<script setup lang="ts">
import { infiniteQueryOptions, useInfiniteQuery } from '@tanstack/vue-query'
const projectsOptions = infiniteQueryOptions({
queryKey: ['projects'],
queryFn: ({ pageParam }) => fetchProjects(pageParam),
initialPageParam: 0,
getNextPageParam: (lastPage) => lastPage.nextId,
initialData: { pages: [], pageParams: [] },
})
// `data` is never `undefined`, thanks to `initialData` — even if a refetch fails, so the
// list stays visible alongside the error.
const { data, isError, error } = useInfiniteQuery(projectsOptions)
</script>