infiniteQueryOptions

Overview

function infiniteQueryOptions<TQueryFnData, TError = Error, TData = InfiniteData<TQueryFnData, unknown>, TQueryKey extends readonly unknown[] = readonly unknown[], TPageParam = unknown>(options: DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>): DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData>, TError>;
function infiniteQueryOptions<TQueryFnData, TError = Error, TData = InfiniteData<TQueryFnData, unknown>, TQueryKey extends readonly unknown[] = readonly unknown[], TPageParam = unknown>(options: UndefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>): UndefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData>, TError>;

DefinedInitialDataInfiniteOptions → DefinedInitialDataInfiniteOptions & QueryKeyWithDataTag: You can generally pass everything to infiniteQueryOptions that you can also pass to createInfiniteQuery. These options can be shared across createInfiniteQuery calls and imperative APIs such as queryClient.infiniteQuery. options.queryKey is required and is the query key to generate options for.
UndefinedInitialDataInfiniteOptions → UndefinedInitialDataInfiniteOptions & QueryKeyWithDataTag: You can generally pass everything to infiniteQueryOptions that you can also pass to createInfiniteQuery. These options can be shared across createInfiniteQuery calls and imperative APIs such as queryClient.infiniteQuery. options.queryKey is required and is the query key to generate options for.

Call Signature

function infiniteQueryOptions<TQueryFnData, TError = Error, TData = InfiniteData<TQueryFnData, unknown>, TQueryKey extends readonly unknown[] = readonly unknown[], TPageParam = unknown>(options: DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>): DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData>, TError>;

Defined in: packages/svelte-query/src/infiniteQueryOptions.ts:98

You can generally pass everything to infiniteQueryOptions that you can also pass to createInfiniteQuery. These options can be shared across createInfiniteQuery calls 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 known to be defined.

Type Parameters

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 createInfiniteQuery, with initialData set.

Returns

DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData>, TError>

The same options object, typed so that queryKey carries the inferred data type.

See

createInfiniteQuery to run an infinite query with these options.

Example

initialData skips the loading state on first render — even if a refetch fails, the list stays visible alongside the error:

svelte

<script lang="ts">
  import { infiniteQueryOptions, createInfiniteQuery } from '@tanstack/svelte-query'

  const projectsOptions = infiniteQueryOptions({
    queryKey: ['projects'],
    queryFn: ({ pageParam }) => fetchProjects(pageParam),
    initialPageParam: 0,
    getNextPageParam: (lastPage) => lastPage.nextId,
    initialData: { pages: [], pageParams: [] },
  })

  const query = createInfiniteQuery(() => projectsOptions)
</script>

{#if query.isError}
  <span>Error: {query.error.message}</span>
{/if}
<ul>
  {#each query.data.pages as page}
    {#each page.projects as project (project.id)}
      <li>{project.name}</li>
    {/each}
  {/each}
</ul>