snapshot of https://github.com/TanStack/query.git (main, 2026-09-16; blobs > 131072B omitted)
Some checks failed
autofix.ci / autofix (push) Failing after 4s
Release / Release (push) Has been skipped
GitHub Actions Security Analysis / Run zizmor (push) Failing after 2s

This commit is contained in:
upstream-mirror
2026-09-16 01:13:08 +05:00
commit 3a013ccdfe
3570 changed files with 490194 additions and 0 deletions

View File

@@ -0,0 +1,139 @@
---
id: devtools
title: Devtools
---
Wave your hands in the air and shout hooray because Solid Query comes with dedicated devtools! 🥳
When you begin your Solid Query journey, you'll want these devtools by your side. They help visualize all of the inner workings of Solid Query and will likely save you hours of debugging if you find yourself in a pinch!
> For Chrome, Firefox, and Edge users: Third-party browser extensions are available for debugging TanStack Query directly in browser DevTools. These provide the same functionality as the framework-specific devtools packages:
>
> - <img alt="Chrome logo" src="https://www.google.com/chrome/static/images/chrome-logo.svg" width="16" height="16" class="inline mr-1 not-prose" /> <a href="https://chromewebstore.google.com/detail/tanstack-query-devtools/annajfchloimdhceglpgglpeepfghfai">Devtools for Chrome</a>
> - <img alt="Firefox logo" src="https://upload.wikimedia.org/wikipedia/commons/a/a0/Firefox_logo%2C_2019.svg" width="16" height="16" class="inline mr-1 not-prose" /> <a href="https://addons.mozilla.org/en-US/firefox/addon/tanstack-query-devtools/">Devtools for Firefox</a>
> - <img alt="Edge logo" src="https://upload.wikimedia.org/wikipedia/commons/9/98/Microsoft_Edge_logo_%282019%29.svg" width="16" height="16" class="inline mr-1 not-prose" /> <a href="https://microsoftedge.microsoft.com/addons/detail/tanstack-query-devtools/edmdpkgkacmjopodhfolmphdenmddobj">Devtools for Edge</a>
## Install and Import the Devtools
The devtools are a separate package that you need to install:
```bash
npm i @tanstack/solid-query-devtools
```
or
```bash
pnpm add @tanstack/solid-query-devtools
```
or
```bash
yarn add @tanstack/solid-query-devtools
```
or
```bash
bun add @tanstack/solid-query-devtools
```
You can import the devtools like this:
```tsx
import { SolidQueryDevtools } from '@tanstack/solid-query-devtools'
```
By default, Solid Query Devtools are only enabled in development mode (`isDev` from `solid-js/web`). In production, the devtools components render nothing. During development, the devtools are loaded only on the client and are not rendered on the server.
## Floating Mode
Floating Mode will mount the devtools as a fixed, floating element in your app and provide a toggle in the corner of the screen to show and hide the devtools. This toggle state will be stored and remembered in localStorage across reloads.
Place the following code as high in your Solid app as you can. The closer it is to the root of the page, the better it will work!
```tsx
import { SolidQueryDevtools } from '@tanstack/solid-query-devtools'
function App() {
return (
<QueryClientProvider client={queryClient}>
{/* The rest of your application */}
<SolidQueryDevtools initialIsOpen={false} />
</QueryClientProvider>
)
}
```
### Options
- `initialIsOpen: boolean`
- Set this `true` if you want the dev tools to default to being open
- `buttonPosition?: "top-left" | "top-right" | "bottom-left" | "bottom-right" | "relative"`
- Defaults to `bottom-right`
- The position of the TanStack logo to open and close the devtools panel
- `position?: "top" | "bottom" | "left" | "right"`
- Defaults to `bottom`
- The position of the Solid Query devtools panel
- `client?: QueryClient`,
- Use this to use a custom QueryClient. Otherwise, the one from the nearest context will be used.
- `errorTypes?: { name: string; initializer: (query: Query) => TError}[]`
- Use this to predefine some errors that can be triggered on your queries. Initializer will be called (with the specific query) when that error is toggled on from the UI. It must return an Error.
- `styleNonce?: string`
- Use this to pass a nonce to the style tag that is added to the document head. This is useful if you are using a Content Security Policy (CSP) nonce to allow inline styles.
- `shadowDOMTarget?: ShadowRoot`
- Default behavior will apply the devtool's styles to the head tag within the DOM.
- Use this to pass a shadow DOM target to the devtools so that the styles will be applied within the shadow DOM instead of within the head tag in the light DOM.
- `theme?: "light" | "dark" | "system"`
- Defaults to `system`.
- Set this to change the theme of the devtools panel.
## Embedded Mode
Embedded mode will show the development tools as a fixed element in your application, so you can use our panel in your own development tools.
Place the following code as high in your Solid app as you can. The closer it is to the root of the page, the better it will work!
```tsx
import { createSignal, Show } from 'solid-js'
import { SolidQueryDevtoolsPanel } from '@tanstack/solid-query-devtools'
function App() {
const [isOpen, setIsOpen] = createSignal(false)
return (
<QueryClientProvider client={queryClient}>
{/* The rest of your application */}
<button
onClick={() => setIsOpen(!isOpen())}
>{`${isOpen() ? 'Close' : 'Open'} the devtools panel`}</button>
<Show when={isOpen()}>
<SolidQueryDevtoolsPanel onClose={() => setIsOpen(false)} />
</Show>
</QueryClientProvider>
)
}
```
### Options
- `style?: JSX.CSSProperties`
- Custom styles for the devtools panel
- Default: `{ height: '500px' }`
- Example: `{ height: '100%' }`
- Example: `{ height: '100%', width: '100%' }`
- `onClose?: () => void`
- Callback function that is called when the devtools panel is closed
- `client?: QueryClient`,
- Use this to use a custom QueryClient. Otherwise, the one from the nearest context will be used.
- `errorTypes?: { name: string; initializer: (query: Query) => TError}[]`
- Use this to predefine some errors that can be triggered on your queries. Initializer will be called (with the specific query) when that error is toggled on from the UI. It must return an Error.
- `styleNonce?: string`
- Use this to pass a nonce to the style tag that is added to the document head. This is useful if you are using a Content Security Policy (CSP) nonce to allow inline styles.
- `shadowDOMTarget?: ShadowRoot`
- Default behavior will apply the devtool's styles to the head tag within the DOM.
- Use this to pass a shadow DOM target to the devtools so that the styles will be applied within the shadow DOM instead of within the head tag in the light DOM.
- `theme?: "light" | "dark" | "system"`
- Defaults to `system`.
- Set this to change the theme of the devtools panel.

View File

@@ -0,0 +1,6 @@
---
id: advanced-ssr
title: Advanced Server Rendering
---
Will come soon

View File

@@ -0,0 +1,57 @@
---
id: background-fetching-indicators
title: Background Fetching Indicators
ref: docs/framework/react/guides/background-fetching-indicators.md
replace: { 'hook': 'function' }
---
[//]: # 'Example'
```tsx
import { Switch, Match, Show, For } from 'solid-js'
function Todos() {
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: fetchTodos,
}))
return (
<Switch>
<Match when={todosQuery.isPending}>
<span>Loading...</span>
</Match>
<Match when={todosQuery.isError}>
<span>Error: {todosQuery.error.message}</span>
</Match>
<Match when={todosQuery.isSuccess}>
<Show when={todosQuery.isFetching}>
<div>Refreshing...</div>
</Show>
<div>
<For each={todosQuery.data}>{(todo) => <Todo todo={todo} />}</For>
</div>
</Match>
</Switch>
)
}
```
[//]: # 'Example'
[//]: # 'Example2'
```tsx
import { useIsFetching } from '@tanstack/solid-query'
function GlobalLoadingIndicator() {
const isFetching = useIsFetching()
return (
<Show when={isFetching()}>
<div>Queries are fetching in the background...</div>
</Show>
)
}
```
[//]: # 'Example2'

View File

@@ -0,0 +1,10 @@
---
id: caching
title: Caching Examples
ref: docs/framework/react/guides/caching.md
replace:
{
'useQuery[(][{] queryKey': 'useQuery(() => ({ queryKey',
'fetchTodos [}][)]': 'fetchTodos }))',
}
---

View File

@@ -0,0 +1,53 @@
---
id: default-query-function
title: Default Query Function
ref: docs/framework/react/guides/default-query-function.md
---
[//]: # 'Example'
```tsx
// Define a default query function that will receive the query key
const defaultQueryFn = async ({ queryKey }) => {
const { data } = await axios.get(
`https://jsonplaceholder.typicode.com${queryKey[0]}`,
)
return data
}
// provide the default query function to your app with defaultOptions
const queryClient = new QueryClient({
defaultOptions: {
queries: {
queryFn: defaultQueryFn,
},
},
})
function App() {
return (
<QueryClientProvider client={queryClient}>
<YourApp />
</QueryClientProvider>
)
}
// All you have to do now is pass a key!
function Posts() {
const postsQuery = useQuery(() => ({ queryKey: ['/posts'] }))
// ...
}
// You can even leave out the queryFn and just go straight into options
function Post(props) {
const postQuery = useQuery(() => ({
queryKey: [`/posts/${props.postId}`],
enabled: !!props.postId,
}))
// ...
}
```
[//]: # 'Example'

View File

@@ -0,0 +1,51 @@
---
id: dependent-queries
title: Dependent Queries
ref: docs/framework/react/guides/dependent-queries.md
---
[//]: # 'Example'
```tsx
// Get the user
const userQuery = useQuery(() => ({
queryKey: ['user', email],
queryFn: getUserByEmail,
}))
const userId = () => userQuery.data?.id
// Then get the user's projects
const projectsQuery = useQuery(() => ({
queryKey: ['projects', userId()],
queryFn: getProjectsByUser,
// The query will not execute until the userId exists
enabled: !!userId(),
}))
```
[//]: # 'Example'
[//]: # 'Example2'
```tsx
// Get the users ids
const usersQuery = useQuery(() => ({
queryKey: ['users'],
queryFn: getUsersData,
select: (users) => users.map((user) => user.id),
}))
// Then get the users messages
const usersMessages = useQueries(() => ({
queries: usersQuery.data
? usersQuery.data.map((id) => {
return {
queryKey: ['messages', id],
queryFn: () => getMessagesByUsers(id),
}
})
: [], // if usersQuery.data is undefined, an empty array will be returned
}))
```
[//]: # 'Example2'

View File

@@ -0,0 +1,102 @@
---
id: disabling-queries
title: Disabling/Pausing Queries
ref: docs/framework/react/guides/disabling-queries.md
---
[//]: # 'Example'
```tsx
import { Switch, Match, Show, For } from 'solid-js'
function Todos() {
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: fetchTodoList,
enabled: false,
}))
return (
<div>
<button onClick={() => todosQuery.refetch()}>Fetch Todos</button>
<Switch>
<Match when={todosQuery.data}>
<ul>
<For each={todosQuery.data}>{(todo) => <li>{todo.title}</li>}</For>
</ul>
</Match>
<Match when={todosQuery.isError}>
<span>Error: {todosQuery.error.message}</span>
</Match>
<Match when={todosQuery.isLoading}>
<span>Loading...</span>
</Match>
<Match when={true}>
<span>Not ready ...</span>
</Match>
</Switch>
<div>{todosQuery.isFetching ? 'Fetching...' : null}</div>
</div>
)
}
```
[//]: # 'Example'
[//]: # 'Example2'
```tsx
import { createSignal } from 'solid-js'
function Todos() {
const [filter, setFilter] = createSignal('')
const todosQuery = useQuery(() => ({
queryKey: ['todos', filter()],
queryFn: () => fetchTodos(filter()),
// ⬇️ disabled as long as the filter is empty
enabled: !!filter(),
}))
return (
<div>
{/* 🚀 applying the filter will enable and execute the query */}
<FiltersForm onApply={setFilter} />
<Show when={todosQuery.data}>
<TodosTable data={todosQuery.data} />
</Show>
</div>
)
}
```
[//]: # 'Example2'
[//]: # 'Example3'
```tsx
import { createSignal } from 'solid-js'
import { skipToken, useQuery } from '@tanstack/solid-query'
function Todos() {
const [filter, setFilter] = createSignal<string | undefined>()
const todosQuery = useQuery(() => ({
queryKey: ['todos', filter()],
// ⬇️ disabled as long as the filter is undefined or empty
queryFn: filter() ? () => fetchTodos(filter()!) : skipToken,
}))
return (
<div>
{/* 🚀 applying the filter will enable and execute the query */}
<FiltersForm onApply={setFilter} />
<Show when={todosQuery.data}>
<TodosTable data={todosQuery.data} />
</Show>
</div>
)
}
```
[//]: # 'Example3'

View File

@@ -0,0 +1,6 @@
---
id: does-this-replace-client-state
title: Does TanStack Query replace global state managers?
ref: docs/framework/react/guides/does-this-replace-client-state.md
replace: { 'hook': 'function' }
---

View File

@@ -0,0 +1,5 @@
---
id: filters
title: Filters
ref: docs/framework/react/guides/filters.md
---

View File

@@ -0,0 +1,13 @@
---
id: important-defaults
title: Important Defaults
ref: docs/framework/react/guides/important-defaults.md
---
[//]: # 'StructuralSharing'
- Query results by default are **structurally shared to detect if data has actually changed** and if not, **the data reference remains unchanged** to better help with value stabilization. If this concept sounds foreign, then don't worry about it! 99.9% of the time you will not need to disable this and it makes your app more performant at zero cost to you.
[//]: # 'StructuralSharing'
[//]: # 'Materials'
[//]: # 'Materials'

View File

@@ -0,0 +1,140 @@
---
id: infinite-queries
title: Infinite Queries
ref: docs/framework/react/guides/infinite-queries.md
---
[//]: # 'Example'
```tsx
import { Switch, Match, For, Show } from 'solid-js'
import { useInfiniteQuery } from '@tanstack/solid-query'
function Projects() {
const fetchProjects = async ({ pageParam }) => {
const res = await fetch('/api/projects?cursor=' + pageParam)
return res.json()
}
const projectsQuery = useInfiniteQuery(() => ({
queryKey: ['projects'],
queryFn: fetchProjects,
initialPageParam: 0,
getNextPageParam: (lastPage, pages) => lastPage.nextCursor,
}))
return (
<Switch>
<Match when={projectsQuery.isPending}>
<p>Loading...</p>
</Match>
<Match when={projectsQuery.isError}>
<p>Error: {projectsQuery.error.message}</p>
</Match>
<Match when={projectsQuery.isSuccess}>
<For each={projectsQuery.data.pages}>
{(group) => (
<For each={group.data}>{(project) => <p>{project.name}</p>}</For>
)}
</For>
<div>
<button
onClick={() => projectsQuery.fetchNextPage()}
disabled={!projectsQuery.hasNextPage || projectsQuery.isFetching}
>
{projectsQuery.isFetchingNextPage
? 'Loading more...'
: projectsQuery.hasNextPage
? 'Load More'
: 'Nothing more to load'}
</button>
</div>
<Show
when={projectsQuery.isFetching && !projectsQuery.isFetchingNextPage}
>
<div>Fetching...</div>
</Show>
</Match>
</Switch>
)
}
```
[//]: # 'Example'
[//]: # 'Example1'
```jsx
<List
onEndReached={() =>
projectsQuery.hasNextPage &&
!projectsQuery.isFetching &&
projectsQuery.fetchNextPage()
}
/>
```
[//]: # 'Example1'
[//]: # 'Example3'
```tsx
useInfiniteQuery(() => ({
queryKey: ['projects'],
queryFn: fetchProjects,
initialPageParam: 0,
getNextPageParam: (lastPage, pages) => lastPage.nextCursor,
getPreviousPageParam: (firstPage, pages) => firstPage.prevCursor,
}))
```
[//]: # 'Example3'
[//]: # 'Example4'
```tsx
useInfiniteQuery(() => ({
queryKey: ['projects'],
queryFn: fetchProjects,
select: (data) => ({
pages: [...data.pages].reverse(),
pageParams: [...data.pageParams].reverse(),
}),
}))
```
[//]: # 'Example4'
[//]: # 'Example8'
```tsx
useInfiniteQuery(() => ({
queryKey: ['projects'],
queryFn: fetchProjects,
initialPageParam: 0,
getNextPageParam: (lastPage, pages) => lastPage.nextCursor,
getPreviousPageParam: (firstPage, pages) => firstPage.prevCursor,
maxPages: 3,
}))
```
[//]: # 'Example8'
[//]: # 'Example9'
```tsx
return useInfiniteQuery(() => ({
queryKey: ['projects'],
queryFn: fetchProjects,
initialPageParam: 0,
getNextPageParam: (lastPage, allPages, lastPageParam) => {
if (lastPage.length === 0) {
return undefined
}
return lastPageParam + 1
},
getPreviousPageParam: (firstPage, allPages, firstPageParam) => {
if (firstPageParam <= 1) {
return undefined
}
return firstPageParam - 1
},
}))
```
[//]: # 'Example9'

View File

@@ -0,0 +1,127 @@
---
id: initial-query-data
title: Initial Query Data
ref: docs/framework/react/guides/initial-query-data.md
replace:
{
'@tanstack/react-query': '@tanstack/solid-query',
'useMutationState[(]': 'useMutationState(() => ',
'useMutation[(]': 'useMutation(() => ',
'useQuery[(]': 'useQuery(() => ',
'useQueries[(]': 'useQueries(() => ',
'useInfiniteQuery[(]': 'useInfiniteQuery(() => ',
}
---
[//]: # 'Example'
```tsx
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: () => fetch('/todos'),
initialData: initialTodos,
}))
```
[//]: # 'Example'
[//]: # 'Example2'
```tsx
// Will show initialTodos immediately, but also immediately refetch todos after mount
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: () => fetch('/todos'),
initialData: initialTodos,
}))
```
[//]: # 'Example2'
[//]: # 'Example3'
```tsx
// Show initialTodos immediately, but won't refetch until another interaction event is encountered after 1000 ms
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: () => fetch('/todos'),
initialData: initialTodos,
staleTime: 1000,
}))
```
[//]: # 'Example3'
[//]: # 'Example4'
```tsx
// Show initialTodos immediately, but won't refetch until another interaction event is encountered after 1000 ms
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: () => fetch('/todos'),
initialData: initialTodos,
staleTime: 60 * 1000, // 1 minute
// This could be 10 seconds ago or 10 minutes ago
initialDataUpdatedAt: initialTodosUpdatedTimestamp, // eg. 1608412420052
}))
```
[//]: # 'Example4'
[//]: # 'Example5'
```tsx
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: () => fetch('/todos'),
initialData: () => getExpensiveTodos(),
}))
```
[//]: # 'Example5'
[//]: # 'Example6'
```tsx
const todoQuery = useQuery(() => ({
queryKey: ['todo', todoId],
queryFn: () => fetch('/todos'),
initialData: () => {
// Use a todo from the 'todos' query as the initial data for this todo query
return queryClient.getQueryData(['todos'])?.find((d) => d.id === todoId)
},
}))
```
[//]: # 'Example6'
[//]: # 'Example7'
```tsx
const todoQuery = useQuery(() => ({
queryKey: ['todos', todoId],
queryFn: () => fetch(`/todos/${todoId}`),
initialData: () =>
queryClient.getQueryData(['todos'])?.find((d) => d.id === todoId),
initialDataUpdatedAt: () =>
queryClient.getQueryState(['todos'])?.dataUpdatedAt,
}))
```
[//]: # 'Example7'
[//]: # 'Example8'
```tsx
const todoQuery = useQuery(() => ({
queryKey: ['todo', todoId],
queryFn: () => fetch(`/todos/${todoId}`),
initialData: () => {
// Get the query state
const state = queryClient.getQueryState(['todos'])
// If the query exists and has data that is no older than 10 seconds...
if (state && Date.now() - state.dataUpdatedAt <= 10 * 1000) {
// return the individual todo
return state.data.find((d) => d.id === todoId)
}
// Otherwise, return undefined and let it fetch from a hard loading state!
},
}))
```
[//]: # 'Example8'

View File

@@ -0,0 +1,16 @@
---
id: invalidations-from-mutations
title: Invalidations from Mutations
ref: docs/framework/react/guides/invalidations-from-mutations.md
replace:
{
'React': 'Solid',
'@tanstack/react-query': '@tanstack/solid-query',
'useMutationState[(]': 'useMutationState(() => ',
'useMutation[(]': 'useMutation(() => ',
'useQuery[(]': 'useQuery(() => ',
'useQueries[(]': 'useQueries(() => ',
'useInfiniteQuery[(]': 'useInfiniteQuery(() => ',
'hook': 'function',
}
---

View File

@@ -0,0 +1,300 @@
---
id: mutations
title: Mutations
ref: docs/framework/react/guides/mutations.md
replace: { 'hook': 'function' }
---
[//]: # 'Example'
```tsx
import { Switch, Match, Show } from 'solid-js'
function App() {
const mutation = useMutation(() => ({
mutationFn: (newTodo) => {
return axios.post('/todos', newTodo)
},
}))
return (
<div>
<Switch>
<Match when={mutation.isPending}>Adding todo...</Match>
<Match when={true}>
<Show when={mutation.isError}>
<div>An error occurred: {mutation.error.message}</div>
</Show>
<Show when={mutation.isSuccess}>
<div>Todo added!</div>
</Show>
<button
onClick={() => {
mutation.mutate({ id: new Date(), title: 'Do Laundry' })
}}
>
Create Todo
</button>
</Match>
</Switch>
</div>
)
}
```
[//]: # 'Example'
[//]: # 'Info1'
[//]: # 'Info1'
[//]: # 'Example2'
```tsx
const CreateTodo = () => {
const mutation = useMutation(() => ({
mutationFn: (formData) => {
return fetch('/api', formData)
},
}))
const onSubmit = (event) => {
event.preventDefault()
mutation.mutate(new FormData(event.target))
}
return <form onSubmit={onSubmit}>...</form>
}
```
[//]: # 'Example2'
[//]: # 'Example3'
```tsx
import { createSignal, Show } from 'solid-js'
const CreateTodo = () => {
const [title, setTitle] = createSignal('')
const mutation = useMutation(() => ({ mutationFn: createTodo }))
const onCreateTodo = (e) => {
e.preventDefault()
mutation.mutate({ title: title() })
}
return (
<form onSubmit={onCreateTodo}>
<Show when={mutation.error}>
<h5 onClick={() => mutation.reset()}>{mutation.error}</h5>
</Show>
<input
type="text"
value={title()}
onInput={(e) => setTitle(e.currentTarget.value)}
/>
<br />
<button type="submit">Create Todo</button>
</form>
)
}
```
[//]: # 'Example3'
[//]: # 'Example4'
```tsx
useMutation(() => ({
mutationFn: addTodo,
onMutate: (variables, context) => {
// A mutation is about to happen!
// Optionally return a result containing data to use when for example rolling back
return { id: 1 }
},
onError: (error, variables, onMutateResult, context) => {
// An error happened!
console.log(`rolling back optimistic update with id ${onMutateResult.id}`)
},
onSuccess: (data, variables, onMutateResult, context) => {
// Boom baby!
},
onSettled: (data, error, variables, onMutateResult, context) => {
// Error or success... doesn't matter!
},
}))
```
[//]: # 'Example4'
[//]: # 'Example5'
```tsx
useMutation(() => ({
mutationFn: addTodo,
onSuccess: async () => {
console.log("I'm first!")
},
onSettled: async () => {
console.log("I'm second!")
},
}))
```
[//]: # 'Example5'
[//]: # 'Example6'
```tsx
useMutation(() => ({
mutationFn: addTodo,
onSuccess: (data, variables, onMutateResult, context) => {
// I will fire first
},
onError: (error, variables, onMutateResult, context) => {
// I will fire first
},
onSettled: (data, error, variables, onMutateResult, context) => {
// I will fire first
},
}))
mutate(todo, {
onSuccess: (data, variables, onMutateResult, context) => {
// I will fire second!
},
onError: (error, variables, onMutateResult, context) => {
// I will fire second!
},
onSettled: (data, error, variables, onMutateResult, context) => {
// I will fire second!
},
})
```
[//]: # 'Example6'
[//]: # 'Example7'
```tsx
useMutation(() => ({
mutationFn: addTodo,
onSuccess: (data, variables, onMutateResult, context) => {
// Will be called 3 times
},
}))
const todos = ['Todo 1', 'Todo 2', 'Todo 3']
todos.forEach((todo) => {
mutate(todo, {
onSuccess: (data, variables, onMutateResult, context) => {
// Will execute only once, for the last mutation (Todo 3),
// regardless which mutation resolves first
},
})
})
```
[//]: # 'Example7'
[//]: # 'Example8'
```tsx
const mutation = useMutation(() => ({ mutationFn: addTodo }))
try {
const todo = await mutation.mutateAsync(todo)
console.log(todo)
} catch (error) {
console.error(error)
} finally {
console.log('done')
}
```
[//]: # 'Example8'
[//]: # 'Example9'
```tsx
const mutation = useMutation(() => ({
mutationFn: addTodo,
retry: 3,
}))
```
[//]: # 'Example9'
[//]: # 'Example10'
```tsx
const queryClient = new QueryClient()
// Define the "addTodo" mutation
queryClient.setMutationDefaults(['addTodo'], {
mutationFn: addTodo,
onMutate: async (variables, context) => {
// Cancel current queries for the todos list
await context.client.cancelQueries({ queryKey: ['todos'] })
// Create optimistic todo
const optimisticTodo = { id: uuid(), title: variables.title }
// Add optimistic todo to todos list
context.client.setQueryData(['todos'], (old) => [...old, optimisticTodo])
// Return a result with the optimistic todo
return { optimisticTodo }
},
onSuccess: (result, variables, onMutateResult, context) => {
// Replace optimistic todo in the todos list with the result
context.client.setQueryData(['todos'], (old) =>
old.map((todo) =>
todo.id === onMutateResult.optimisticTodo.id ? result : todo,
),
)
},
onError: (error, variables, onMutateResult, context) => {
// Remove optimistic todo from the todos list
context.client.setQueryData(['todos'], (old) =>
old.filter((todo) => todo.id !== onMutateResult.optimisticTodo.id),
)
},
retry: 3,
})
// Start mutation in some component:
const mutation = useMutation(() => ({ mutationKey: ['addTodo'] }))
mutation.mutate({ title: 'title' })
// If the mutation has been paused because the device is for example offline,
// Then the paused mutation can be dehydrated when the application quits:
const state = dehydrate(queryClient)
// The mutation can then be hydrated again when the application is started:
hydrate(queryClient, state)
// Resume the paused mutations:
queryClient.resumePausedMutations()
```
[//]: # 'Example10'
[//]: # 'PersistOfflineIntro'
### Persisting Offline mutations
If you persist offline mutations with the `persistQueryClient` plugin, mutations cannot be resumed when the page is reloaded unless you provide a default mutation function.
[//]: # 'PersistOfflineIntro'
[//]: # 'OfflineExampleLink'
[//]: # 'OfflineExampleLink'
[//]: # 'ExampleScopes'
```tsx
const mutation = useMutation(() => ({
mutationFn: addTodo,
scope: {
id: 'todo',
},
}))
```
[//]: # 'ExampleScopes'
[//]: # 'Materials'
## Further reading
For more information about mutations, have a look at [TkDodo's article on Mastering Mutations in TanStack Query](https://tkdodo.eu/blog/mastering-mutations-in-react-query).
[//]: # 'Materials'

View File

@@ -0,0 +1,5 @@
---
id: network-mode
title: Network Mode
ref: docs/framework/react/guides/network-mode.md
---

View File

@@ -0,0 +1,146 @@
---
id: optimistic-updates
title: Optimistic Updates
ref: docs/framework/react/guides/optimistic-updates.md
replace: { 'React Query': 'Solid Query', 'hook': 'function' }
---
[//]: # 'ExampleUI1'
```tsx
const addTodoMutation = useMutation(() => ({
mutationFn: (newTodo: string) => axios.post('/api/data', { text: newTodo }),
// make sure to _return_ the Promise from the query invalidation
// so that the mutation stays in `pending` state until the refetch is finished
onSettled: () => queryClient.invalidateQueries({ queryKey: ['todos'] }),
}))
```
[//]: # 'ExampleUI1'
[//]: # 'ExampleUI2'
```tsx
<ul>
<For each={todoQuery.data}>{(todo) => <li>{todo.text}</li>}</For>
<Show when={addTodoMutation.isPending}>
<li style={{ opacity: 0.5 }}>{addTodoMutation.variables}</li>
</Show>
</ul>
```
[//]: # 'ExampleUI2'
[//]: # 'ExampleUI3'
```tsx
<Show when={addTodoMutation.isError}>
<li style={{ color: 'red' }}>
{addTodoMutation.variables}
<button onClick={() => addTodoMutation.mutate(addTodoMutation.variables)}>
Retry
</button>
</li>
</Show>
```
[//]: # 'ExampleUI3'
[//]: # 'ExampleUI4'
```tsx
// somewhere in your app
const mutation = useMutation(() => ({
mutationFn: (newTodo: string) => axios.post('/api/data', { text: newTodo }),
onSettled: () => queryClient.invalidateQueries({ queryKey: ['todos'] }),
mutationKey: ['addTodo'],
}))
// access variables somewhere else
const variables = useMutationState(() => ({
filters: { mutationKey: ['addTodo'], status: 'pending' },
select: (mutation) => mutation.state.variables,
}))
```
[//]: # 'ExampleUI4'
[//]: # 'Example'
```tsx
const queryClient = useQueryClient()
useMutation(() => ({
mutationFn: updateTodo,
// When mutate is called:
onMutate: async (newTodo, context) => {
// Cancel any outgoing refetches
// (so they don't overwrite our optimistic update)
await context.client.cancelQueries({ queryKey: ['todos'] })
// Snapshot the previous value
const previousTodos = context.client.getQueryData(['todos'])
// Optimistically update to the new value
context.client.setQueryData(['todos'], (old) => [...old, newTodo])
// Return a result with the snapshotted value
return { previousTodos }
},
// If the mutation fails,
// use the result returned from onMutate to roll back
onError: (err, newTodo, onMutateResult, context) => {
context.client.setQueryData(['todos'], onMutateResult.previousTodos)
},
// Always refetch after error or success:
onSettled: (data, error, variables, onMutateResult, context) =>
context.client.invalidateQueries({ queryKey: ['todos'] }),
}))
```
[//]: # 'Example'
[//]: # 'Example2'
```tsx
useMutation(() => ({
mutationFn: updateTodo,
// When mutate is called:
onMutate: async (newTodo, context) => {
// Cancel any outgoing refetches
// (so they don't overwrite our optimistic update)
await context.client.cancelQueries({ queryKey: ['todos', newTodo.id] })
// Snapshot the previous value
const previousTodo = context.client.getQueryData(['todos', newTodo.id])
// Optimistically update to the new value
context.client.setQueryData(['todos', newTodo.id], newTodo)
// Return a result with the previous and new todo
return { previousTodo, newTodo }
},
// If the mutation fails, use the result we returned above
onError: (err, newTodo, onMutateResult, context) => {
context.client.setQueryData(
['todos', onMutateResult.newTodo.id],
onMutateResult.previousTodo,
)
},
// Always refetch after error or success:
onSettled: (newTodo, error, variables, onMutateResult, context) =>
context.client.invalidateQueries({ queryKey: ['todos', newTodo.id] }),
}))
```
[//]: # 'Example2'
[//]: # 'Example3'
```tsx
useMutation(() => ({
mutationFn: updateTodo,
// ...
onSettled: async (newTodo, error, variables, onMutateResult, context) => {
if (error) {
// do something
}
},
}))
```
[//]: # 'Example3'

View File

@@ -0,0 +1,81 @@
---
id: paginated-queries
title: Paginated / Lagged Queries
ref: docs/framework/react/guides/paginated-queries.md
replace: { 'hook': 'function' }
---
[//]: # 'Example'
```tsx
const projectsQuery = useQuery(() => ({
queryKey: ['projects', page()],
queryFn: () => fetchProjects(page()),
}))
```
[//]: # 'Example'
[//]: # 'Example2'
```tsx
import { createSignal, Switch, Match, Show, For } from 'solid-js'
import { keepPreviousData, useQuery } from '@tanstack/solid-query'
function Todos() {
const [page, setPage] = createSignal(0)
const fetchProjects = (page = 0) =>
fetch('/api/projects?page=' + page).then((res) => res.json())
const projectsQuery = useQuery(() => ({
queryKey: ['projects', page()],
queryFn: () => fetchProjects(page()),
placeholderData: keepPreviousData,
}))
return (
<div>
<Switch>
<Match when={projectsQuery.isPending}>
<div>Loading...</div>
</Match>
<Match when={projectsQuery.isError}>
<div>Error: {projectsQuery.error.message}</div>
</Match>
<Match when={projectsQuery.isSuccess}>
<div>
<For each={projectsQuery.data.projects}>
{(project) => <p>{project.name}</p>}
</For>
</div>
</Match>
</Switch>
<span>Current Page: {page() + 1}</span>
<button
onClick={() => setPage((old) => Math.max(old - 1, 0))}
disabled={page() === 0}
>
Previous Page
</button>
<button
onClick={() => {
if (!projectsQuery.isPlaceholderData && projectsQuery.data?.hasMore) {
setPage((old) => old + 1)
}
}}
// Disable the Next Page button until we know a next page is available
disabled={
projectsQuery.isPlaceholderData || !projectsQuery.data?.hasMore
}
>
Next Page
</button>
<Show when={projectsQuery.isFetching}>
<span> Loading...</span>
</Show>
</div>
)
}
```
[//]: # 'Example2'

View File

@@ -0,0 +1,57 @@
---
id: parallel-queries
title: Parallel Queries
ref: docs/framework/react/guides/parallel-queries.md
replace:
{
'@tanstack/react-query': '@tanstack/solid-query',
'useMutationState[(]': 'useMutationState(() => ',
'useMutation[(]': 'useMutation(() => ',
'useQuery[(]': 'useQuery(() => ',
'useQueries[(]': 'useQueries(() => ',
'useInfiniteQuery[(]': 'useInfiniteQuery(() => ',
'hooks': 'functions',
}
---
[//]: # 'Example'
```tsx
function App () {
// The following queries will execute in parallel
const usersQuery = useQuery(() => ({ queryKey: ['users'], queryFn: fetchUsers }))
const teamsQuery = useQuery(() => ({ queryKey: ['teams'], queryFn: fetchTeams }))
const projectsQuery = useQuery(() => ({ queryKey: ['projects'], queryFn: fetchProjects }))
...
}
```
[//]: # 'Example'
[//]: # 'Info'
[//]: # 'Info'
[//]: # 'DynamicParallelIntro'
If the number of queries you need to execute changes, you cannot use manual querying since that would break reactivity. Instead, TanStack Query provides a `useQueries` function, which you can use to dynamically execute as many queries in parallel as you'd like.
[//]: # 'DynamicParallelIntro'
[//]: # 'DynamicParallelDescription'
`useQueries` accepts an **accessor that returns an options object** with a **queries key** whose value is an **array of query objects**. It returns an **array of query results**:
[//]: # 'DynamicParallelDescription'
[//]: # 'Example2'
```tsx
function App(props) {
const userQueries = useQueries(() => ({
queries: props.users.map((user) => {
return {
queryKey: ['user', user.id],
queryFn: () => fetchUserById(user.id),
}
}),
}))
}
```
[//]: # 'Example2'

View File

@@ -0,0 +1,68 @@
---
id: placeholder-query-data
title: Placeholder Query Data
ref: docs/framework/react/guides/placeholder-query-data.md
---
[//]: # 'ExampleValue'
```tsx
function Todos() {
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: () => fetch('/todos'),
placeholderData: placeholderTodos,
}))
}
```
[//]: # 'ExampleValue'
[//]: # 'Memoization'
### Placeholder Data Memoization
If the process for accessing a query's placeholder data is intensive or just not something you want to perform on every render, you can memoize the value:
```tsx
function Todos() {
const placeholderData = createMemo(() => generateFakeTodos())
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: () => fetch('/todos'),
placeholderData: placeholderData(),
}))
}
```
[//]: # 'Memoization'
[//]: # 'ExampleFunction'
```tsx
const todosQuery = useQuery(() => ({
queryKey: ['todos', id],
queryFn: () => fetch(`/todos/${id}`),
placeholderData: (previousData, previousQuery) => previousData,
}))
```
[//]: # 'ExampleFunction'
[//]: # 'ExampleCache'
```tsx
function BlogPost(props) {
const queryClient = useQueryClient()
const blogPostQuery = useQuery(() => ({
queryKey: ['blogPost', props.blogPostId],
queryFn: () => fetch(`/blogPosts/${props.blogPostId}`),
placeholderData: () => {
// Use the smaller/preview version of the blogPost from the 'blogPosts'
// query as the placeholder data for this blogPost query
return queryClient
.getQueryData(['blogPosts'])
?.find((d) => d.id === props.blogPostId)
},
}))
}
```
[//]: # 'ExampleCache'

View File

@@ -0,0 +1,73 @@
---
id: polling
title: Polling
ref: docs/framework/react/guides/polling.md
replace: { '@tanstack/react-query': '@tanstack/solid-query' }
---
[//]: # 'Example1'
```tsx
useQuery(() => ({
queryKey: ['prices'],
queryFn: fetchPrices,
refetchInterval: 5_000, // every 5 seconds
}))
```
[//]: # 'Example1'
[//]: # 'Example2'
```tsx
useQuery(() => ({
queryKey: ['job', jobId],
queryFn: () => fetchJobStatus(jobId),
refetchInterval: (query) => {
// Stop polling once the job finishes
if (query.state.data?.status === 'complete') return false
return 2_000
},
}))
```
[//]: # 'Example2'
[//]: # 'Example3'
```tsx
useQuery(() => ({
queryKey: ['portfolio'],
queryFn: fetchPortfolio,
refetchInterval: 30_000,
refetchIntervalInBackground: true,
}))
```
[//]: # 'Example3'
[//]: # 'Example4'
```tsx
useQuery(() => ({
queryKey: ['prices', tokenAddress],
queryFn: () => fetchPrice(tokenAddress),
refetchInterval: () => {
if (!tokenAddress || isPaused) return false
return 15_000
},
}))
```
[//]: # 'Example4'
[//]: # 'Example5'
```tsx
useQuery(() => ({
queryKey: ['chainStatus'],
queryFn: fetchChainStatus,
refetchInterval: 10_000,
networkMode: 'always',
}))
```
[//]: # 'Example5'
[//]: # 'ReactNative'
[//]: # 'ReactNative'

View File

@@ -0,0 +1,272 @@
---
id: prefetching
title: Prefetching & Router Integration
ref: docs/framework/react/guides/prefetching.md
replace: { 'react-query': 'solid-query', 'React': 'Solid' }
---
[//]: # 'ExampleComponent'
```tsx
import { Switch, Match } from 'solid-js'
function Article(props) {
const articleQuery = useQuery(() => ({
queryKey: ['article', props.id],
queryFn: getArticleById,
}))
return (
<Switch>
<Match when={articleQuery.isPending}>
Loading article...
</Match>
<Match when={articleQuery.isSuccess}>
<ArticleHeader articleData={articleQuery.data} />
<ArticleBody articleData={articleQuery.data} />
<Comments id={props.id} />
</Match>
</Switch>
)
}
function Comments(props) {
const commentsQuery = useQuery(() => ({
queryKey: ['article-comments', props.id],
queryFn: getArticleCommentsById,
}))
...
}
```
[//]: # 'ExampleComponent'
[//]: # 'ExampleParentComponent'
```tsx
import { Switch, Match } from 'solid-js'
function Article(props) {
const articleQuery = useQuery(() => ({
queryKey: ['article', props.id],
queryFn: getArticleById,
}))
// Prefetch
useQuery(() => ({
queryKey: ['article-comments', props.id],
queryFn: getArticleCommentsById,
// Optional optimization to avoid rerenders when this query changes:
notifyOnChangeProps: [],
}))
return (
<Switch>
<Match when={articleQuery.isPending}>
Loading article...
</Match>
<Match when={articleQuery.isSuccess}>
<ArticleHeader articleData={articleQuery.data} />
<ArticleBody articleData={articleQuery.data} />
<Comments id={props.id} />
</Match>
</Switch>
)
}
function Comments(props) {
const commentsQuery = useQuery(() => ({
queryKey: ['article-comments', props.id],
queryFn: getArticleCommentsById,
}))
...
}
```
[//]: # 'ExampleParentComponent'
[//]: # 'Suspense'
Another way is to prefetch inside the query function. This makes sense if you know that every time an article is fetched it's very likely comments will also be needed. For this, we'll use `queryClient.query`:
```tsx
const queryClient = useQueryClient()
const articleQuery = useQuery(() => ({
queryKey: ['article', id],
queryFn: (...args) => {
void queryClient
.query({
queryKey: ['article-comments', id],
queryFn: getArticleCommentsById,
})
.catch(noop)
return getArticleById(...args)
},
}))
```
Prefetching in an effect also works:
```tsx
import { createEffect } from 'solid-js'
const queryClient = useQueryClient()
createEffect(() => {
void queryClient
.query({
queryKey: ['article-comments', id],
queryFn: getArticleCommentsById,
})
.catch(noop)
})
```
To recap, if you want to prefetch a query during the component lifecycle, there are a few different ways to do it, pick the one that suits your situation best:
- Use `useQuery` and ignore the result
- Prefetch inside the query function
- Prefetch in an effect
Let's look at a slightly more advanced case next.
[//]: # 'Suspense'
[//]: # 'ExampleConditionally1'
```tsx
import { lazy, Switch, Match, For } from 'solid-js'
// This lazy loads the GraphFeedItem component, meaning
// it wont start loading until something renders it
const GraphFeedItem = lazy(() => import('./GraphFeedItem'))
function Feed() {
const feedQuery = useQuery(() => ({
queryKey: ['feed'],
queryFn: getFeed,
}))
return (
<Switch>
<Match when={feedQuery.isPending}>
Loading feed...
</Match>
<Match when={feedQuery.isSuccess}>
<For each={feedQuery.data}>
{(feedItem) => {
if (feedItem.type === 'GRAPH') {
return <GraphFeedItem feedItem={feedItem} />
}
return <StandardFeedItem feedItem={feedItem} />
}}
</For>
</Match>
</Switch>
)
}
// GraphFeedItem.tsx
function GraphFeedItem(props) {
const graphQuery = useQuery(() => ({
queryKey: ['graph', props.feedItem.id],
queryFn: getGraphDataById,
}))
...
}
```
[//]: # 'ExampleConditionally1'
[//]: # 'ExampleConditionally2'
```tsx
function Feed() {
const queryClient = useQueryClient()
const feedQuery = useQuery(() => ({
queryKey: ['feed'],
queryFn: async (...args) => {
const feed = await getFeed(...args)
for (const feedItem of feed) {
if (feedItem.type === 'GRAPH') {
void queryClient.query({
queryKey: ['graph', feedItem.id],
queryFn: getGraphDataById,
}).catch(noop)
}
}
return feed
}
}))
...
}
```
[//]: # 'ExampleConditionally2'
[//]: # 'Router'
## Router Integration
Because data fetching in the component tree itself can easily lead to request waterfalls and the different fixes for that can be cumbersome as they accumulate throughout the application, an attractive way to do prefetching is integrating it at the router level.
In this approach, you explicitly declare for each _route_ what data is going to be needed for that component tree, ahead of time. Because Server Rendering has traditionally needed all data to be loaded before rendering starts, this has been the dominating approach for SSR'd apps for a long time. This is still a common approach and you can read more about it in the [Server Rendering & Hydration guide](./ssr.md).
For now, let's focus on the client side case and look at an example of how you can make this work with [TanStack Router](https://tanstack.com/router). These examples leave out a lot of setup and boilerplate to stay concise, you can check out a [full Solid Query example](https://tanstack.com/router/latest/docs/framework/solid/examples/basic-solid-query-file-based) over in the [TanStack Router docs](https://tanstack.com/router/latest/docs).
When integrating at the router level, you can choose to either _block_ rendering of that route until all data is present, or you can start a prefetch but not await the result. That way, you can start rendering the route as soon as possible. You can also mix these two approaches and await some critical data, but start rendering before all the secondary data has finished loading. In this example, we'll configure an `/article` route to not render until the article data has finished loading, as well as start prefetching comments as soon as possible, but not block rendering the route if comments haven't finished loading yet.
Note that many route loaders use error boundaries to trigger error fallbacks. Whereas up to now we have been using `.catch(noop)` to ignore errors for data that will be retried by `useQuery`, for critical data that the route will not work without, you should `await` the promise without `noop` and handle the error in a `try` block or the router's error handling (such as TanStack Router's `errorComponent`).
```tsx
const queryClient = new QueryClient()
const routerContext = new RouterContext()
const rootRoute = routerContext.createRootRoute({
component: () => { ... }
})
const articleRoute = new Route({
getParentRoute: () => rootRoute,
path: 'article',
beforeLoad: () => {
return {
articleQueryOptions: { queryKey: ['article'], queryFn: fetchArticle },
commentsQueryOptions: { queryKey: ['comments'], queryFn: fetchComments },
}
},
loader: async ({
context: { queryClient },
routeContext: { articleQueryOptions, commentsQueryOptions },
}) => {
// Fetch comments asap, but don't block or throw errors
void queryClient.query(commentsQueryOptions).catch(noop)
// Don't render the route at all until article has been fetched
// As this is critical data we want the error component to trigger
// as soon as possible if something goes wrong
await queryClient.query({
...articleQueryOptions,
// If we have the article loaded already, we don't want to block on
// an extra prefetch; fallback on the default useQuery behavior to
// keep the data fresh
staleTime: 'static'
})
},
component: ({ useRouteContext }) => {
const { articleQueryOptions, commentsQueryOptions } = useRouteContext()
const articleQuery = useQuery(() => articleQueryOptions)
const commentsQuery = useQuery(() => commentsQueryOptions)
return (
...
)
},
errorComponent: () => 'Oh crap!',
})
```
Integration with other routers is also possible.
[//]: # 'Router'

View File

@@ -0,0 +1,97 @@
---
id: queries
title: Queries
ref: docs/framework/react/guides/queries.md
---
[//]: # 'SubscribeDescription'
To subscribe to a query in your components, call the `useQuery` function with at least:
[//]: # 'SubscribeDescription'
[//]: # 'Example'
```tsx
import { useQuery } from '@tanstack/solid-query'
function App() {
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: fetchTodoList,
}))
}
```
[//]: # 'Example'
[//]: # 'Example2'
```tsx
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: fetchTodoList,
}))
```
[//]: # 'Example2'
[//]: # 'Example3'
```tsx
import { Switch, Match, For } from 'solid-js'
function Todos() {
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: fetchTodoList,
}))
return (
<Switch>
<Match when={todosQuery.isPending}>
<span>Loading...</span>
</Match>
<Match when={todosQuery.isError}>
<span>Error: {todosQuery.error.message}</span>
</Match>
<Match when={todosQuery.isSuccess}>
<ul>
<For each={todosQuery.data}>{(todo) => <li>{todo.title}</li>}</For>
</ul>
</Match>
</Switch>
)
}
```
[//]: # 'Example3'
[//]: # 'Example4'
```tsx
import { Switch, Match, For } from 'solid-js'
function Todos() {
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: fetchTodoList,
}))
return (
<Switch>
<Match when={todosQuery.status === 'pending'}>
<span>Loading...</span>
</Match>
<Match when={todosQuery.status === 'error'}>
<span>Error: {todosQuery.error.message}</span>
</Match>
<Match when={todosQuery.status === 'success'}>
<ul>
<For each={todosQuery.data}>{(todo) => <li>{todo.title}</li>}</For>
</ul>
</Match>
</Switch>
)
}
```
[//]: # 'Example4'
[//]: # 'Materials'
[//]: # 'Materials'

View File

@@ -0,0 +1,165 @@
---
id: query-cancellation
title: Query Cancellation
ref: docs/framework/react/guides/query-cancellation.md
replace:
{
'@tanstack/react-query': '@tanstack/solid-query',
'useMutationState[(]': 'useMutationState(() => ',
'useMutation[(]': 'useMutation(() => ',
'useQuery[(]': 'useQuery(() => ',
'useQueries[(]': 'useQueries(() => ',
'useInfiniteQuery[(]': 'useInfiniteQuery(() => ',
}
---
[//]: # 'Example'
```tsx
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: async ({ signal }) => {
const todosResponse = await fetch('/todos', {
// Pass the signal to one fetch
signal,
})
const todos = await todosResponse.json()
const todoDetails = todos.map(async ({ details }) => {
const response = await fetch(details, {
// Or pass it to several
signal,
})
return response.json()
})
return Promise.all(todoDetails)
},
}))
```
[//]: # 'Example'
[//]: # 'Example2'
```tsx
import axios from 'axios'
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: ({ signal }) =>
axios.get('/todos', {
// Pass the signal to `axios`
signal,
}),
}))
```
[//]: # 'Example2'
[//]: # 'Example3'
```tsx
import axios from 'axios'
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: ({ signal }) => {
// Create a new CancelToken source for this request
const CancelToken = axios.CancelToken
const source = CancelToken.source()
const promise = axios.get('/todos', {
// Pass the source token to your request
cancelToken: source.token,
})
// Cancel the request if TanStack Query signals to abort
signal?.addEventListener('abort', () => {
source.cancel('Query was cancelled by TanStack Query')
})
return promise
},
}))
```
[//]: # 'Example3'
[//]: # 'Example4'
```tsx
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: ({ signal }) => {
return new Promise((resolve, reject) => {
var oReq = new XMLHttpRequest()
oReq.addEventListener('load', () => {
resolve(JSON.parse(oReq.responseText))
})
signal?.addEventListener('abort', () => {
oReq.abort()
reject()
})
oReq.open('GET', '/todos')
oReq.send()
})
},
}))
```
[//]: # 'Example4'
[//]: # 'Example5'
```tsx
const client = new GraphQLClient(endpoint)
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: ({ signal }) => {
client.request({ document: query, signal })
},
}))
```
[//]: # 'Example5'
[//]: # 'Example6'
```tsx
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: ({ signal }) => {
const client = new GraphQLClient(endpoint, {
signal,
})
return client.request(query, variables)
},
}))
```
[//]: # 'Example6'
[//]: # 'Example7'
```tsx
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: async ({ signal }) => {
const resp = await fetch('/todos', { signal })
return resp.json()
},
}))
const queryClient = useQueryClient()
return (
<button
onClick={(e) => {
e.preventDefault()
queryClient.cancelQueries({ queryKey: ['todos'] })
}}
>
Cancel
</button>
)
```
[//]: # 'Example7'
[//]: # 'Limitations'
[//]: # 'Limitations'

View File

@@ -0,0 +1,81 @@
---
id: query-functions
title: Query Functions
ref: docs/framework/react/guides/query-functions.md
---
[//]: # 'Example'
```tsx
useQuery(() => ({ queryKey: ['todos'], queryFn: fetchAllTodos }))
useQuery(() => ({
queryKey: ['todos', todoId],
queryFn: () => fetchTodoById(todoId),
}))
useQuery(() => ({
queryKey: ['todos', todoId],
queryFn: async () => {
const data = await fetchTodoById(todoId)
return data
},
}))
useQuery(() => ({
queryKey: ['todos', todoId],
queryFn: ({ queryKey }) => fetchTodoById(queryKey[1]),
}))
```
[//]: # 'Example'
[//]: # 'Example2'
```tsx
const todosQuery = useQuery(() => ({
queryKey: ['todos', todoId],
queryFn: async () => {
if (somethingGoesWrong) {
throw new Error('Oh no!')
}
if (somethingElseGoesWrong) {
return Promise.reject(new Error('Oh no!'))
}
return data
},
}))
```
[//]: # 'Example2'
[//]: # 'Example3'
```tsx
useQuery(() => ({
queryKey: ['todos', todoId],
queryFn: async () => {
const response = await fetch('/todos/' + todoId)
if (!response.ok) {
throw new Error('Network response was not ok')
}
return response.json()
},
}))
```
[//]: # 'Example3'
[//]: # 'Example4'
```tsx
function Todos(props) {
const todosQuery = useQuery(() => ({
queryKey: ['todos', { status: props.status, page: props.page }],
queryFn: fetchTodoList,
}))
}
// Access the key, status and page variables in your query function!
function fetchTodoList({ queryKey }) {
const [_key, { status, page }] = queryKey
return new Promise()
}
```
[//]: # 'Example4'

View File

@@ -0,0 +1,15 @@
---
id: query-invalidation
title: Query Invalidation
ref: docs/framework/react/guides/query-invalidation.md
replace:
{
'@tanstack/react-query': '@tanstack/solid-query',
'useMutationState[(]': 'useMutationState(() => ',
'useMutation[(]': 'useMutation(() => ',
'useQuery[(]': 'useQuery(() => ',
'useQueries[(]': 'useQueries(() => ',
'useInfiniteQuery[(]': 'useInfiniteQuery(() => ',
'hooks': 'functions',
}
---

View File

@@ -0,0 +1,71 @@
---
id: query-keys
title: Query Keys
ref: docs/framework/react/guides/query-keys.md
replace:
{
'@tanstack/react-query': '@tanstack/solid-query',
'useMutationState[(]': 'useMutationState(() => ',
'useMutation[(]': 'useMutation(() => ',
'useQuery[(]': 'useQuery(() => ',
'useQueries[(]': 'useQueries(() => ',
'useInfiniteQuery[(]': 'useInfiniteQuery(() => ',
'React Query Keys': 'TanStack Query Keys',
}
---
[//]: # 'Example'
```tsx
// A list of todos
useQuery(() => ({ queryKey: ['todos'], ... }))
// Something else, whatever!
useQuery(() => ({ queryKey: ['something', 'special'], ... }))
```
[//]: # 'Example'
[//]: # 'Example2'
```tsx
// An individual todo
useQuery(() => ({ queryKey: ['todo', 5], ... }))
// An individual todo in a "preview" format
useQuery(() => ({ queryKey: ['todo', 5, { preview: true }], ...}))
// A list of todos that are "done"
useQuery(() => ({ queryKey: ['todos', { type: 'done' }], ... }))
```
[//]: # 'Example2'
[//]: # 'Example3'
```tsx
useQuery(() => ({ queryKey: ['todos', { status, page }], ... }))
useQuery(() => ({ queryKey: ['todos', { page, status }], ...}))
useQuery(() => ({ queryKey: ['todos', { page, status, other: undefined }], ... }))
```
[//]: # 'Example3'
[//]: # 'Example4'
```tsx
useQuery(() => ({ queryKey: ['todos', status, page], ... }))
useQuery(() => ({ queryKey: ['todos', page, status], ...}))
useQuery(() => ({ queryKey: ['todos', undefined, page, status], ...}))
```
[//]: # 'Example4'
[//]: # 'Example5'
```tsx
function Todos(props) {
const todosQuery = useQuery(() => ({
queryKey: ['todos', props.todoId],
queryFn: () => fetchTodoById(props.todoId),
}))
}
```
[//]: # 'Example5'

View File

@@ -0,0 +1,56 @@
---
id: query-options
title: Query Options
ref: docs/framework/react/guides/query-options.md
replace:
{
'@tanstack/react-query': '@tanstack/solid-query',
'useMutationState[(]': 'useMutationState(() => ',
'useMutation[(]': 'useMutation(() => ',
'useQuery[(]': 'useQuery(() => ',
'useQueries[(]': 'useQueries(() => ',
'useInfiniteQuery[(]': 'useInfiniteQuery(() => ',
}
---
[//]: # 'Example1'
```ts
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)
```
[//]: # 'Example1'
[//]: # 'SelectDescription'
You can still override some options at the component level. A very common and useful pattern is to create per-component `select` functions:
[//]: # 'SelectDescription'
[//]: # 'Example2'
```ts
// 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,
}))
```
[//]: # 'Example2'

View File

@@ -0,0 +1,14 @@
---
id: query-retries
title: Query Retries
ref: docs/framework/react/guides/query-retries.md
replace:
{
'@tanstack/react-query': '@tanstack/solid-query',
'useMutationState[(]': 'useMutationState(() => ',
'useMutation[(]': 'useMutation(() => ',
'useQuery[(]': 'useQuery(() => ',
'useQueries[(]': 'useQueries(() => ',
'useInfiniteQuery[(]': 'useInfiniteQuery(() => ',
}
---

View File

@@ -0,0 +1,209 @@
---
id: request-waterfalls
title: Performance & Request Waterfalls
ref: docs/framework/react/guides/request-waterfalls.md
replace: { 'React Query': 'Solid Query' }
---
[//]: # 'AdvancedSSRLink'
[//]: # 'AdvancedSSRLink'
[//]: # 'DependentExample'
```tsx
// Get the user
const userQuery = useQuery(() => ({
queryKey: ['user', email],
queryFn: getUserByEmail,
}))
const userId = () => userQuery.data?.id
// Then get the user's projects
const projectsQuery = useQuery(() => ({
queryKey: ['projects', userId()],
queryFn: getProjectsByUser,
// The query will not execute until the userId exists
enabled: !!userId(),
}))
```
[//]: # 'DependentExample'
[//]: # 'ServerComponentsNote1'
[//]: # 'ServerComponentsNote1'
[//]: # 'SuspenseSerial'
[//]: # 'SuspenseSerial'
[//]: # 'NestedIntro'
Nested Component Waterfalls is when both a parent and a child component contains queries, and the parent does not render the child until its query is done.
[//]: # 'NestedIntro'
[//]: # 'NestedExample'
```tsx
import { Switch, Match } from 'solid-js'
function Article(props) {
const articleQuery = useQuery(() => ({
queryKey: ['article', props.id],
queryFn: getArticleById,
}))
return (
<Switch>
<Match when={articleQuery.isPending}>
Loading article...
</Match>
<Match when={articleQuery.isSuccess}>
<ArticleHeader articleData={articleQuery.data} />
<ArticleBody articleData={articleQuery.data} />
<Comments id={props.id} />
</Match>
</Switch>
)
}
function Comments(props) {
const commentsQuery = useQuery(() => ({
queryKey: ['article-comments', props.id],
queryFn: getArticleCommentsById,
}))
...
}
```
[//]: # 'NestedExample'
[//]: # 'NestedHoistedExample'
```tsx
import { Switch, Match, Show } from 'solid-js'
function Article(props) {
const articleQuery = useQuery(() => ({
queryKey: ['article', props.id],
queryFn: getArticleById,
}))
const commentsQuery = useQuery(() => ({
queryKey: ['article-comments', props.id],
queryFn: getArticleCommentsById,
}))
return (
<Switch>
<Match when={articleQuery.isPending}>Loading article...</Match>
<Match when={articleQuery.isSuccess}>
<ArticleHeader articleData={articleQuery.data} />
<ArticleBody articleData={articleQuery.data} />
<Switch>
<Match when={commentsQuery.isPending}>Loading comments...</Match>
<Match when={commentsQuery.isSuccess}>
<Comments commentsData={commentsQuery.data} />
</Match>
</Switch>
</Match>
</Switch>
)
}
```
[//]: # 'NestedHoistedExample'
[//]: # 'NestedHoistedOutro'
The two queries will now fetch in parallel.
[//]: # 'NestedHoistedOutro'
[//]: # 'DependentNestedExample'
```tsx
import { Switch, Match, For } from 'solid-js'
function Feed() {
const feedQuery = useQuery(() => ({
queryKey: ['feed'],
queryFn: getFeed,
}))
return (
<Switch>
<Match when={feedQuery.isPending}>
Loading feed...
</Match>
<Match when={feedQuery.isSuccess}>
<For each={feedQuery.data}>
{(feedItem) => {
if (feedItem.type === 'GRAPH') {
return <GraphFeedItem feedItem={feedItem} />
}
return <StandardFeedItem feedItem={feedItem} />
}}
</For>
</Match>
</Switch>
)
}
function GraphFeedItem(props) {
const graphQuery = useQuery(() => ({
queryKey: ['graph', props.feedItem.id],
queryFn: getGraphDataById,
}))
...
}
```
[//]: # 'DependentNestedExample'
[//]: # 'ServerComponentsNote2'
In this example, we can't trivially flatten the waterfall by just hoisting the query to the parent, or even adding prefetching. Just like the dependent query example at the beginning of this guide, one option is to refactor our API to include the graph data in the `getFeed` query.
[//]: # 'ServerComponentsNote2'
[//]: # 'LazyExample'
```tsx
import { lazy, Switch, Match, For } from 'solid-js'
// This lazy loads the GraphFeedItem component, meaning
// it wont start loading until something renders it
const GraphFeedItem = lazy(() => import('./GraphFeedItem'))
function Feed() {
const feedQuery = useQuery(() => ({
queryKey: ['feed'],
queryFn: getFeed,
}))
return (
<Switch>
<Match when={feedQuery.isPending}>
Loading feed...
</Match>
<Match when={feedQuery.isSuccess}>
<For each={feedQuery.data}>
{(feedItem) => {
if (feedItem.type === 'GRAPH') {
return <GraphFeedItem feedItem={feedItem} />
}
return <StandardFeedItem feedItem={feedItem} />
}}
</For>
</Match>
</Switch>
)
}
// GraphFeedItem.tsx
function GraphFeedItem(props) {
const graphQuery = useQuery(() => ({
queryKey: ['graph', props.feedItem.id],
queryFn: getGraphDataById,
}))
...
}
```
[//]: # 'LazyExample'
[//]: # 'ServerComponentsNote3'
[//]: # 'ServerComponentsNote3'

View File

@@ -0,0 +1,6 @@
---
id: scroll-restoration
title: Scroll Restoration
ref: docs/framework/react/guides/scroll-restoration.md
replace: { 'React Router’s ScrollRestoration, ': '' }
---

View File

@@ -0,0 +1,6 @@
---
id: ssr
title: SSR
---
Will come soon

View File

@@ -0,0 +1,41 @@
---
id: suspense
title: Suspense
---
Solid Query can also be used with Solid's [Suspense](https://docs.solidjs.com/reference/components/suspense) API's.
To do that you need to wrap your suspendable component with `Suspense` component provided by Solid
```tsx
import { Suspense } from 'solid-js'
;<Suspense fallback={<LoadingSpinner />}>
<SuspendableComponent />
</Suspense>
```
You can use async `suspense` function that is provided by `solid-query`.
```tsx
import { useQuery } from '@tanstack/solid-query'
const todoFetcher = async () =>
await fetch('https://jsonplaceholder.cypress.io/todos').then((response) =>
response.json(),
)
function SuspendableComponent() {
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: todoFetcher,
}))
// Accessing todosQuery.data directly inside a <Suspense> boundary
// automatically triggers suspension until data is ready
return <div>Data: {JSON.stringify(todosQuery.data)}</div>
}
```
## Fetch-on-render vs Render-as-you-fetch
Out of the box, Solid Query in `suspense` mode works really well as a **Fetch-on-render** solution with no additional configuration. This means that when your components attempt to mount, they will trigger query fetching and suspend, but only once you have imported them and mounted them. If you want to take it to the next level and implement a **Render-as-you-fetch** model, we recommend implementing [Prefetching](./prefetching) on routing callbacks and/or user interactions events to start loading queries before they are mounted and hopefully even before you start importing or mounting their parent components.

View File

@@ -0,0 +1,4 @@
---
id: testing
title: Testing
---

View File

@@ -0,0 +1,50 @@
---
id: updates-from-mutation-responses
title: Updates from Mutation Responses
ref: docs/framework/react/guides/updates-from-mutation-responses.md
replace: { 'hook': 'function' }
---
[//]: # 'Example'
```tsx
const queryClient = useQueryClient()
const mutation = useMutation(() => ({
mutationFn: editTodo,
onSuccess: (data) => {
queryClient.setQueryData(['todo', { id: 5 }], data)
},
}))
mutation.mutate({
id: 5,
name: 'Do the laundry',
})
// The query below will be updated with the response from the
// successful mutation
const todoQuery = useQuery(() => ({
queryKey: ['todo', { id: 5 }],
queryFn: fetchTodoById,
}))
```
[//]: # 'Example'
[//]: # 'Example2'
```tsx
const useMutateTodo = () => {
const queryClient = useQueryClient()
return useMutation(() => ({
mutationFn: editTodo,
// Notice the second argument is the variables object that the `mutate` function receives
onSuccess: (data, variables) => {
queryClient.setQueryData(['todo', { id: variables.id }], data)
},
}))
}
```
[//]: # 'Example2'

View File

@@ -0,0 +1,20 @@
---
id: window-focus-refetching
title: Window Focus Refetching
ref: docs/framework/react/guides/window-focus-refetching.md
replace: { '@tanstack/react-query': '@tanstack/solid-query' }
---
[//]: # 'Example2'
```tsx
useQuery(() => ({
queryKey: ['todos'],
queryFn: fetchTodos,
refetchOnWindowFocus: false,
}))
```
[//]: # 'Example2'
[//]: # 'ReactNative'
[//]: # 'ReactNative'

View File

@@ -0,0 +1,59 @@
---
id: installation
title: Installation
---
You can install Solid Query via [NPM](https://npmjs.com/),
or a good ol' `<script>` via
[ESM.sh](https://esm.sh/).
### NPM
```bash
npm i @tanstack/solid-query
```
or
```bash
pnpm add @tanstack/solid-query
```
or
```bash
yarn add @tanstack/solid-query
```
or
```bash
bun add @tanstack/solid-query
```
> Wanna give it a spin before you download? Try out the [simple](./examples/simple) or [basic](./examples/basic) examples!
### CDN
If you're not using a module bundler or package manager, you can also use this library via an ESM-compatible CDN such as [ESM.sh](https://esm.sh/). Simply add a `<script type="module">` tag to the bottom of your HTML file:
```html
<script type="module">
import { QueryClient } from 'https://esm.sh/@tanstack/solid-query'
</script>
```
### Requirements
Solid Query is optimized for modern browsers. It is compatible with the following browsers config
```
Chrome >= 91
Firefox >= 90
Edge >= 91
Safari >= 15
iOS >= 15
Opera >= 77
```
> Depending on your environment, you might need to add polyfills. If you want to support older browsers, you need to transpile the library from `node_modules` yourselves.

View File

@@ -0,0 +1,138 @@
---
id: overview
title: Overview
---
Solid Query is the official SolidJS adapter of TanStack Query that makes **fetching, caching, synchronizing and updating server state** in your web applications a breeze.
## Motivation
SolidJS has been gaining popularity as a fast, reactive, and declarative library for building user interfaces. It comes packed with a lot of features out of the box. Primitives like `createSignal`, `createStore` are great for managing client state. And, unlike other UI libraries, SolidJS has strong opinions about managing asynchronous data. The `createResource` API is a great primitive for handling server state in SolidJS apps. A `resource` is a special kind of signal that can be used to trigger `Suspense` boundaries when the data is in a loading state.
```tsx
import { createResource, ErrorBoundary, Suspense } from 'solid-js'
import { render } from 'solid-js/web'
function App() {
const [repository] = createResource(async () => {
const result = await fetch('https://api.github.com/repos/TanStack/query')
if (!result.ok) throw new Error('Failed to fetch data')
return result.json()
})
return (
<div>
<div>Static Content</div>
{/* An error while fetching will be caught by the ErrorBoundary */}
<ErrorBoundary fallback={<div>Something went wrong!</div>}>
{/* Suspense will trigger a loading state while the data is being fetched */}
<Suspense fallback={<div>Loading...</div>}>
<div>{repository()?.updated_at}</div>
</Suspense>
</ErrorBoundary>
</div>
)
}
const root = document.getElementById('root')
render(() => <App />, root!)
```
This is amazing! In a few lines of code, you can fetch data from an API and handle loading and error states. But, as your application grows in complexity, you will need more features to manage server state effectively. This is because **server state is totally different from client state**. For starters, server state:
- Is persisted remotely in a location you do not control or own
- Requires asynchronous APIs for fetching and updating
- Implies shared ownership and can be changed by other people without your knowledge
- Can potentially become "out of date" in your applications if you're not careful
Once you grasp the nature of server state in your application, **even more challenges will arise** as you go, for example:
- Caching... (possibly the hardest thing to do in programming)
- Deduping multiple requests for the same data into a single request
- Updating "out of date" data in the background
- Knowing when data is "out of date"
- Reflecting updates to data as quickly as possible
- Performance optimizations like pagination and lazy loading data
- Managing memory and garbage collection of server state
- Memoizing query results with structural sharing
This is where **Solid Query** comes in. The library wraps around `createResource` and provides a set of hooks and utilities to manage server state effectively. It works amazingly well **out-of-the-box, with zero-config, and can be customized** to your liking as your application grows.
On a more technical note, Solid Query will likely:
- Help you remove **many** lines of complicated and misunderstood code from your application and replace with just a handful of lines of Solid Query logic.
- Make your application more maintainable and easier to build new features without worrying about wiring up new server state data sources
- Have a direct impact on your end-users by making your application feel faster and more responsive than ever before.
- Potentially help you save on bandwidth and increase memory performance
## Enough talk, show me some code already!
In the example below, you can see Solid Query in its most basic and simple form being used to fetch the GitHub stats for the TanStack Query GitHub project itself:
```tsx
import { ErrorBoundary, Suspense } from 'solid-js'
import {
useQuery,
QueryClient,
QueryClientProvider,
} from '@tanstack/solid-query'
function App() {
const repositoryQuery = useQuery(() => ({
queryKey: ['TanStack Query'],
queryFn: async () => {
const result = await fetch('https://api.github.com/repos/TanStack/query')
if (!result.ok) throw new Error('Failed to fetch data')
return result.json()
},
staleTime: 1000 * 60 * 5, // 5 minutes
throwOnError: true, // Throw an error if the query fails
}))
return (
<div>
<div>Static Content</div>
{/* An error while fetching will be caught by the ErrorBoundary */}
<ErrorBoundary fallback={<div>Something went wrong!</div>}>
{/* Suspense will trigger a loading state while the data is being fetched */}
<Suspense fallback={<div>Loading...</div>}>
{/*
The `data` property on a query is a SolidJS resource
so it will work with Suspense and transitions out of the box!
*/}
<div>{repositoryQuery.data?.updated_at}</div>
</Suspense>
</ErrorBoundary>
</div>
)
}
const root = document.getElementById('root')
const client = new QueryClient()
render(
() => (
<QueryClientProvider client={client}>
<App />
</QueryClientProvider>
),
root!,
)
```
## Well, that seems like more lines of code to do the same thing?
Yes it is! But, these few lines of code unlock a whole new world of possibilities. In the example above, your query is cached for 5 minutes, meaning that if a new component mounts anywhere in your app that uses the same query within 5 minutes, it will not re-fetch the data but instead use the cached data. This is just one of the many features that Solid Query provides out of the box. Some other features include:
- **Automatic Refetching**: Queries automatically refetch in the background when they become "stale" (out of date according to the `staleTime` option)
- **Automatic Caching**: Queries are cached by default and shared across your application
- **Request Deduplication**: Multiple components can share the same query and make one request
- **Automatic Garbage Collection**: Queries are garbage collected when they are no longer needed
- **Window Focus Refetching**: Queries automatically refetch when the application comes back into focus
- **Pagination**: Built-in support for pagination
- **Request Cancellation**: Automatically cancels outdated or unwanted requests
- **Polling/Realtime**: It's easy to add polling or realtime updates to your queries with a simple `refetchInterval` option
- **SSR Support**: Solid Query works great with server-side rendering
- **Optimistic Updates**: Easily update your cache with optimistic updates
- **And much more...**

View File

@@ -0,0 +1,5 @@
---
id: broadcastQueryClient
title: broadcastQueryClient (Experimental)
ref: docs/framework/react/plugins/broadcastQueryClient.md
---

View File

@@ -0,0 +1,6 @@
---
id: createPersister
title: experimental_createPersister
ref: docs/framework/react/plugins/createPersister.md
replace: { 'react-query': 'solid-query' }
---

View File

@@ -0,0 +1,217 @@
---
id: quick-start
title: Quick Start
---
The `@tanstack/solid-query` package provides a 1st-class API for using TanStack Query with SolidJS.
## Example
```tsx
import {
QueryClient,
QueryClientProvider,
useQuery,
} from '@tanstack/solid-query'
import { Switch, Match, For } from 'solid-js'
const queryClient = new QueryClient()
function Example() {
const query = useQuery(() => ({
queryKey: ['todos'],
queryFn: fetchTodos,
}))
return (
<div>
<Switch>
<Match when={query.isPending}>
<p>Loading...</p>
</Match>
<Match when={query.isError}>
<p>Error: {query.error.message}</p>
</Match>
<Match when={query.isSuccess}>
<For each={query.data}>{(todo) => <p>{todo.title}</p>}</For>
</Match>
</Switch>
</div>
)
}
function App() {
return (
<QueryClientProvider client={queryClient}>
<Example />
</QueryClientProvider>
)
}
```
## Important Differences between Solid Query & React Query
Solid Query offers an API similar to React Query, but there are some key differences to be mindful of.
- Arguments to `solid-query` primitives (like `useQuery`, `useMutation`, `useIsFetching`) are functions, so that they can be tracked in a reactive scope.
```tsx
// ❌ react version
useQuery({
queryKey: ['todos', todo],
queryFn: fetchTodos,
})
// ✅ solid version
useQuery(() => ({
queryKey: ['todos', todo],
queryFn: fetchTodos,
}))
```
- Suspense works for queries out of the box if you access the query data inside a `<Suspense>` boundary.
```tsx
import { For, Suspense } from 'solid-js'
function Example() {
const query = useQuery(() => ({
queryKey: ['todos'],
queryFn: fetchTodos,
}))
return (
<div>
{/* ✅ Will trigger loading fallback, data accessed in a suspense boundary. */}
<Suspense fallback={'Loading...'}>
<For each={query.data}>{(todo) => <div>{todo.title}</div>}</For>
</Suspense>
{/* ❌ Will not trigger loading fallback, data not accessed in a suspense boundary. */}
<For each={query.data}>{(todo) => <div>{todo.title}</div>}</For>
</div>
)
}
```
- Solid Query primitives do not support destructuring. The return value from these functions is a store, and their properties are only tracked in a reactive context.
```tsx
import {
QueryClient,
QueryClientProvider,
useQuery,
} from '@tanstack/solid-query'
import { Match, Switch } from 'solid-js'
const queryClient = new QueryClient()
export default function App() {
return (
<QueryClientProvider client={queryClient}>
<Example />
</QueryClientProvider>
)
}
function Example() {
// ❌ react version -- supports destructing outside reactive context
// const { isPending, error, data } = useQuery({
// queryKey: ['repoData'],
// queryFn: () =>
// fetch('https://api.github.com/repos/tannerlinsley/react-query').then(
// (res) => res.json()
// ),
// })
// ✅ solid version -- does not support destructuring outside reactive context
const query = useQuery(() => ({
queryKey: ['repoData'],
queryFn: () =>
fetch('https://api.github.com/repos/tannerlinsley/react-query').then(
(res) => res.json(),
),
}))
// ✅ access query properties in JSX reactive context
return (
<Switch>
<Match when={query.isPending}>Loading...</Match>
<Match when={query.isError}>Error: {query.error.message}</Match>
<Match when={query.isSuccess}>
<div>
<h1>{query.data.name}</h1>
<p>{query.data.description}</p>
<strong>👀 {query.data.subscribers_count}</strong>{' '}
<strong>✨ {query.data.stargazers_count}</strong>{' '}
<strong>🍴 {query.data.forks_count}</strong>
</div>
</Match>
</Switch>
)
}
```
- Signals and store values can be passed in directly to function arguments. Solid Query will update the query `store` automatically.
```tsx
import {
QueryClient,
QueryClientProvider,
useQuery,
} from '@tanstack/solid-query'
import { createSignal, For } from 'solid-js'
const queryClient = new QueryClient()
function Example() {
const [enabled, setEnabled] = createSignal(false)
const [todo, setTodo] = createSignal(0)
// ✅ passing a signal directly is safe and observers update
// automatically when the value of a signal changes
const todosQuery = useQuery(() => ({
queryKey: ['todos'],
queryFn: fetchTodos,
enabled: enabled(),
}))
const todoDetailsQuery = useQuery(() => ({
queryKey: ['todo', todo()],
queryFn: fetchTodo,
enabled: todo() > 0,
}))
return (
<div>
<Switch>
<Match when={todosQuery.isPending}>
<p>Loading...</p>
</Match>
<Match when={todosQuery.isError}>
<p>Error: {todosQuery.error.message}</p>
</Match>
<Match when={todosQuery.isSuccess}>
<For each={todosQuery.data}>
{(todo) => (
<button onClick={() => setTodo(todo.id)}>{todo.title}</button>
)}
</For>
</Match>
</Switch>
<button onClick={() => setEnabled(!enabled())}>Toggle enabled</button>
</div>
)
}
function App() {
return (
<QueryClientProvider client={queryClient}>
<Example />
</QueryClientProvider>
)
}
```
- Errors can be caught and reset using SolidJS' native `ErrorBoundary` component.
Set `throwOnError` or the `suspense` option to `true` to make sure errors are thrown to the `ErrorBoundary`
- Since Property tracking is handled through Solid's fine grained reactivity, options like `notifyOnChangeProps` are not needed

View File

@@ -0,0 +1,273 @@
---
id: CancelledError
title: CancelledError
---
Defined in: [packages/query-core/src/retryer.ts:77](https://github.com/TanStack/query/blob/main/packages/query-core/src/retryer.ts#L77)
The error thrown by a `Retryer` (and surfaced to `query.promise`/`mutation`) when a fetch is cancelled, e.g. via
`query.cancel()`. `revert`, if `true`, tells the caller to restore the state the query was in before the fetch
started instead of surfacing the error. `silent`, if `true`, tells the caller to suppress this error and instead
resolve with the promise of the fetch that triggered the cancellation.
## Example
```ts
query.cancel()
try {
await query.promise
} catch (error) {
if (error instanceof CancelledError) {
// the fetch was cancelled, e.g. via `query.cancel()`
}
}
```
## Extends
- `Error`
## Constructors
### Constructor
```ts
new CancelledError(options?): CancelledError;
```
Defined in: [packages/query-core/src/retryer.ts:80](https://github.com/TanStack/query/blob/main/packages/query-core/src/retryer.ts#L80)
#### Parameters
##### options?
[`CancelOptions`](../interfaces/CancelOptions.md)
#### Returns
`CancelledError`
#### Overrides
```ts
Error.constructor
```
## Properties
### cause?
```ts
optional cause: unknown;
```
Defined in: node\_modules/.pnpm/typescript@6.0.3/node\_modules/typescript/lib/lib.es2022.error.d.ts:24
#### Inherited from
```ts
Error.cause
```
***
### message
```ts
message: string;
```
Defined in: node\_modules/.pnpm/typescript@6.0.3/node\_modules/typescript/lib/lib.es5.d.ts:1075
#### Inherited from
```ts
Error.message
```
***
### name
```ts
name: string;
```
Defined in: node\_modules/.pnpm/typescript@6.0.3/node\_modules/typescript/lib/lib.es5.d.ts:1074
#### Inherited from
```ts
Error.name
```
***
### revert?
```ts
optional revert: boolean;
```
Defined in: [packages/query-core/src/retryer.ts:78](https://github.com/TanStack/query/blob/main/packages/query-core/src/retryer.ts#L78)
***
### silent?
```ts
optional silent: boolean;
```
Defined in: [packages/query-core/src/retryer.ts:79](https://github.com/TanStack/query/blob/main/packages/query-core/src/retryer.ts#L79)
***
### stack?
```ts
optional stack: string;
```
Defined in: node\_modules/.pnpm/typescript@6.0.3/node\_modules/typescript/lib/lib.es5.d.ts:1076
#### Inherited from
```ts
Error.stack
```
***
### stackTraceLimit
```ts
static stackTraceLimit: number;
```
Defined in: node\_modules/.pnpm/@types+node@22.19.15/node\_modules/@types/node/globals.d.ts:68
The `Error.stackTraceLimit` property specifies the number of stack frames
collected by a stack trace (whether generated by `new Error().stack` or
`Error.captureStackTrace(obj)`).
The default value is `10` but may be set to any valid JavaScript number. Changes
will affect any stack trace captured _after_ the value has been changed.
If set to a non-number value, or set to a negative number, stack traces will
not capture any frames.
#### Inherited from
```ts
Error.stackTraceLimit
```
## Methods
### captureStackTrace()
```ts
static captureStackTrace(targetObject, constructorOpt?): void;
```
Defined in: node\_modules/.pnpm/@types+node@22.19.15/node\_modules/@types/node/globals.d.ts:52
Creates a `.stack` property on `targetObject`, which when accessed returns
a string representing the location in the code at which
`Error.captureStackTrace()` was called.
```js
const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
```
The first line of the trace will be prefixed with
`${myObject.name}: ${myObject.message}`.
The optional `constructorOpt` argument accepts a function. If given, all frames
above `constructorOpt`, including `constructorOpt`, will be omitted from the
generated stack trace.
The `constructorOpt` argument is useful for hiding implementation
details of error generation from the user. For instance:
```js
function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
```
#### Parameters
##### targetObject
`object`
##### constructorOpt?
`Function`
#### Returns
`void`
#### Inherited from
```ts
Error.captureStackTrace
```
***
### prepareStackTrace()
```ts
static prepareStackTrace(err, stackTraces): any;
```
Defined in: node\_modules/.pnpm/@types+node@22.19.15/node\_modules/@types/node/globals.d.ts:56
#### Parameters
##### err
`Error`
##### stackTraces
`CallSite`[]
#### Returns
`any`
#### See
https://v8.dev/docs/stack-trace-api#customizing-stack-traces
#### Inherited from
```ts
Error.prepareStackTrace
```

View File

@@ -0,0 +1,665 @@
---
id: InfiniteQueryObserver
title: InfiniteQueryObserver
---
Defined in: [packages/query-core/src/infiniteQueryObserver.ts:41](https://github.com/TanStack/query/blob/main/packages/query-core/src/infiniteQueryObserver.ts#L41)
An `InfiniteQueryObserver` extends `QueryObserver` to observe and switch
between infinite queries. It augments the base `QueryObserverResult` with
infinite-query-specific fields and methods, such as `hasNextPage` and
`fetchNextPage`, and is the primitive that framework adapters (e.g.
`useInfiniteQuery`) build their hooks on top of.
## Example
```ts
const observer = new InfiniteQueryObserver(queryClient, {
queryKey: ['projects'],
queryFn: ({ pageParam }) => fetchProjects(pageParam),
initialPageParam: 0,
getNextPageParam: (lastPage) => lastPage.nextCursor,
})
const unsubscribe = observer.subscribe((result) => console.log(result))
```
## Extends
- [`QueryObserver`](QueryObserver.md)\<`TQueryFnData`, `TError`, `TData`, [`InfiniteData`](../interfaces/InfiniteData.md)\<`TQueryFnData`, `TPageParam`\>, `TQueryKey`\>
## Type Parameters
### TQueryFnData
`TQueryFnData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
### TData
`TData` = [`InfiniteData`](../interfaces/InfiniteData.md)\<`TQueryFnData`\>
### TQueryKey
`TQueryKey` *extends* [`QueryKey`](../type-aliases/QueryKey.md) = [`QueryKey`](../type-aliases/QueryKey.md)
### TPageParam
`TPageParam` = `unknown`
## Constructors
### Constructor
```ts
new InfiniteQueryObserver<TQueryFnData, TError, TData, TQueryKey, TPageParam>(client, options): InfiniteQueryObserver<TQueryFnData, TError, TData, TQueryKey, TPageParam>;
```
Defined in: [packages/query-core/src/infiniteQueryObserver.ts:83](https://github.com/TanStack/query/blob/main/packages/query-core/src/infiniteQueryObserver.ts#L83)
#### Parameters
##### client
`QueryClient`
##### options
`InfiniteQueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>
#### Returns
`InfiniteQueryObserver`\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>
#### Overrides
[`QueryObserver`](QueryObserver.md).[`constructor`](QueryObserver.md#constructor)
## Properties
### fetch
```ts
protected fetch: ReplaceReturnType<(fetchOptions) => Promise<QueryObserverResult<TData, TError>>, Promise<InfiniteQueryObserverResult<TData, TError>>>;
```
Defined in: [packages/query-core/src/infiniteQueryObserver.ts:72](https://github.com/TanStack/query/blob/main/packages/query-core/src/infiniteQueryObserver.ts#L72)
#### Overrides
```ts
QueryObserver.fetch
```
***
### getCurrentResult
```ts
getCurrentResult: ReplaceReturnType<() => QueryObserverResult<TData, TError>, InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/infiniteQueryObserver.ts:60](https://github.com/TanStack/query/blob/main/packages/query-core/src/infiniteQueryObserver.ts#L60)
Returns the most recently computed `QueryObserverResult` for the
observed query. This is a point-in-time read; to be notified of updates
as they happen, subscribe to the observer instead (its inherited
`subscribe` method).
#### Example
```ts
const result = observer.getCurrentResult()
console.log(result.status, result.data)
```
#### Overrides
```ts
QueryObserver.getCurrentResult
```
***
### listeners
```ts
protected listeners: Set<QueryObserverListener<TData, TError>>;
```
Defined in: [packages/query-core/src/subscribable.ts:2](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L2)
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`listeners`](QueryObserver.md#listeners)
***
### options
```ts
options: QueryObserverOptions<TQueryFnData, TError, TData, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/queryObserver.ts:89](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L89)
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`options`](QueryObserver.md#options)
***
### subscribe()
```ts
subscribe: (listener) => () => void;
```
Defined in: [packages/query-core/src/infiniteQueryObserver.ts:55](https://github.com/TanStack/query/blob/main/packages/query-core/src/infiniteQueryObserver.ts#L55)
#### Parameters
##### listener
`InfiniteQueryObserverListener`
#### Returns
```ts
(): void;
```
##### Returns
`void`
#### Overrides
```ts
QueryObserver.subscribe
```
## Methods
### bindMethods()
```ts
protected bindMethods(): void;
```
Defined in: [packages/query-core/src/infiniteQueryObserver.ts:96](https://github.com/TanStack/query/blob/main/packages/query-core/src/infiniteQueryObserver.ts#L96)
#### Returns
`void`
#### Overrides
[`QueryObserver`](QueryObserver.md).[`bindMethods`](QueryObserver.md#bindmethods)
***
### createResult()
```ts
protected createResult(query, options): InfiniteQueryObserverResult<TData, TError>;
```
Defined in: [packages/query-core/src/infiniteQueryObserver.ts:201](https://github.com/TanStack/query/blob/main/packages/query-core/src/infiniteQueryObserver.ts#L201)
#### Parameters
##### query
[`Query`](Query.md)\<`TQueryFnData`, `TError`, [`InfiniteData`](../interfaces/InfiniteData.md)\<`TQueryFnData`, `TPageParam`\>, `TQueryKey`\>
##### options
`InfiniteQueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>
#### Returns
[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>
#### Overrides
[`QueryObserver`](QueryObserver.md).[`createResult`](QueryObserver.md#createresult)
***
### destroy()
```ts
destroy(): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:161](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L161)
Stops observing the current query: clears all listeners, cancels the
stale and refetch-interval timers, and removes this observer from the
query it was observing.
#### Returns
`void`
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`destroy`](QueryObserver.md#destroy)
***
### fetchNextPage()
```ts
fetchNextPage(options?): Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/infiniteQueryObserver.ts:161](https://github.com/TanStack/query/blob/main/packages/query-core/src/infiniteQueryObserver.ts#L161)
Fetches the next page of the infinite query and returns a promise that
resolves with the resulting `InfiniteQueryObserverResult`. The page
param used for the fetch is determined by `getNextPageParam`, which
receives the current pages/page params and whose result also determines
`hasNextPage`.
#### Parameters
##### options?
[`FetchNextPageOptions`](../interfaces/FetchNextPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Example
```ts
const { hasNextPage } = observer.getCurrentResult()
if (hasNextPage) {
await observer.fetchNextPage()
}
```
#### See
[InfiniteQueryObserver#fetchPreviousPage](#fetchpreviouspage)
***
### fetchOptimistic()
```ts
fetchOptimistic(options): Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/queryObserver.ts:395](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L395)
Fetches a query defined by the given options without affecting this
observer's own tracked query or result, and returns a promise that
resolves with the `QueryObserverResult` for that fetch. This is useful
for prefetching data that another observer (e.g. a query about to be
navigated to) will need, ahead of time.
#### Parameters
##### options
`QueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, [`InfiniteData`](../interfaces/InfiniteData.md)\<`TQueryFnData`, `TPageParam`\>, `TQueryKey`\>
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
#### Example
```ts
const result = await observer.fetchOptimistic({
queryKey: ['posts', 2],
queryFn: () => fetchPost(2),
})
console.log(result.data)
```
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`fetchOptimistic`](QueryObserver.md#fetchoptimistic)
***
### fetchPreviousPage()
```ts
fetchPreviousPage(options?): Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/infiniteQueryObserver.ts:190](https://github.com/TanStack/query/blob/main/packages/query-core/src/infiniteQueryObserver.ts#L190)
Fetches the previous page of the infinite query and returns a promise
that resolves with the resulting `InfiniteQueryObserverResult`. The page
param used for the fetch is determined by `getPreviousPageParam`, which
receives the current pages/page params and whose result also determines
`hasPreviousPage`.
#### Parameters
##### options?
[`FetchPreviousPageOptions`](../interfaces/FetchPreviousPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Example
```ts
const { hasPreviousPage } = observer.getCurrentResult()
if (hasPreviousPage) {
await observer.fetchPreviousPage()
}
```
#### See
[InfiniteQueryObserver#fetchNextPage](#fetchnextpage)
***
### getCurrentQuery()
```ts
getCurrentQuery(): Query<TQueryFnData, TError, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/queryObserver.ts:357](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L357)
Returns the `Query` instance this observer is currently observing.
#### Returns
[`Query`](Query.md)\<`TQueryFnData`, `TError`, [`InfiniteData`](../interfaces/InfiniteData.md)\<`TQueryFnData`, `TPageParam`\>, `TQueryKey`\>
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`getCurrentQuery`](QueryObserver.md#getcurrentquery)
***
### getOptimisticResult()
```ts
getOptimisticResult(options): InfiniteQueryObserverResult<TData, TError>;
```
Defined in: [packages/query-core/src/infiniteQueryObserver.ts:127](https://github.com/TanStack/query/blob/main/packages/query-core/src/infiniteQueryObserver.ts#L127)
The infinite-query counterpart of [QueryObserver#getOptimisticResult](QueryObserver.md#getoptimisticresult), marking the
options as an infinite query before delegating to it. Called by framework adapters (e.g.
`useInfiniteQuery`) ahead of subscribing, to compute the current `InfiniteQueryObserverResult`
synchronously.
#### Parameters
##### options
[`DefaultedInfiniteQueryObserverOptions`](../type-aliases/DefaultedInfiniteQueryObserverOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>
#### Returns
[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>
#### Overrides
[`QueryObserver`](QueryObserver.md).[`getOptimisticResult`](QueryObserver.md#getoptimisticresult)
***
### hasListeners()
```ts
hasListeners(): boolean;
```
Defined in: [packages/query-core/src/subscribable.ts:19](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L19)
#### Returns
`boolean`
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`hasListeners`](QueryObserver.md#haslisteners)
***
### onSubscribe()
```ts
protected onSubscribe(): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:110](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L110)
#### Returns
`void`
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`onSubscribe`](QueryObserver.md#onsubscribe)
***
### onUnsubscribe()
```ts
protected onUnsubscribe(): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:124](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L124)
#### Returns
`void`
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`onUnsubscribe`](QueryObserver.md#onunsubscribe)
***
### refetch()
```ts
refetch(__namedParameters): Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/queryObserver.ts:371](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L371)
Refetches the observed query and returns a promise that resolves with
the resulting `QueryObserverResult`.
#### Parameters
##### \_\_namedParameters
[`RefetchOptions`](../interfaces/RefetchOptions.md) = `{}`
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
#### Example
```ts
const result = await observer.refetch({ cancelRefetch: false })
console.log(result.data)
```
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`refetch`](QueryObserver.md#refetch)
***
### setOptions()
```ts
setOptions(options): void;
```
Defined in: [packages/query-core/src/infiniteQueryObserver.ts:108](https://github.com/TanStack/query/blob/main/packages/query-core/src/infiniteQueryObserver.ts#L108)
Updates the observer's options. Behaves the same as
`QueryObserver.setOptions`, additionally marking the options as
belonging to an infinite query before delegating to the base
implementation.
#### Parameters
##### options
`InfiniteQueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>
#### Returns
`void`
#### Overrides
[`QueryObserver`](QueryObserver.md).[`setOptions`](QueryObserver.md#setoptions)
***
### shouldFetchOnReconnect()
```ts
shouldFetchOnReconnect(): boolean;
```
Defined in: [packages/query-core/src/queryObserver.ts:135](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L135)
Returns whether the observed query is currently stale and configured
(via the `refetchOnReconnect` option) to refetch when the network
reconnects.
#### Returns
`boolean`
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`shouldFetchOnReconnect`](QueryObserver.md#shouldfetchonreconnect)
***
### shouldFetchOnWindowFocus()
```ts
shouldFetchOnWindowFocus(): boolean;
```
Defined in: [packages/query-core/src/queryObserver.ts:148](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L148)
Returns whether the observed query is currently stale and configured
(via the `refetchOnWindowFocus` option) to refetch when the window
regains focus.
#### Returns
`boolean`
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`shouldFetchOnWindowFocus`](QueryObserver.md#shouldfetchonwindowfocus)
***
### trackProp()
```ts
trackProp(key): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:350](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L350)
Records that the given `QueryObserverResult` property was read, so a subsequent update only
notifies this observer if a tracked property actually changed. Normally called indirectly via
[QueryObserver#trackResult](QueryObserver.md#trackresult)'s proxy; exposed directly for adapters that track property
access themselves (e.g. through their own reactivity system) instead of via the proxy.
#### Parameters
##### key
`"error"` | `"data"` | `"isError"` | `"isPending"` | `"isLoading"` | `"isLoadingError"` | `"isRefetchError"` | `"isSuccess"` | `"isPlaceholderData"` | `"status"` | `"dataUpdatedAt"` | `"errorUpdatedAt"` | `"failureCount"` | `"failureReason"` | `"errorUpdateCount"` | `"isFetched"` | `"isFetchedAfterMount"` | `"isFetching"` | `"isInitialLoading"` | `"isPaused"` | `"isRefetching"` | `"isStale"` | `"isEnabled"` | `"refetch"` | `"fetchStatus"`
#### Returns
`void`
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`trackProp`](QueryObserver.md#trackprop)
***
### trackResult()
```ts
trackResult(result, onPropTracked?): QueryObserverResult<TData, TError>;
```
Defined in: [packages/query-core/src/queryObserver.ts:331](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L331)
Wraps a `QueryObserverResult` in a `Proxy` that records which properties are read, via
[QueryObserver#trackProp](QueryObserver.md#trackprop) (and an optional `onPropTracked` callback). Used by framework
adapters when `notifyOnChangeProps` is not set, to implement its default "only re-render on
properties you actually read" behavior.
#### Parameters
##### result
[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>
##### onPropTracked?
(`key`) => `void`
#### Returns
[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`trackResult`](QueryObserver.md#trackresult)
***
### updateResult()
```ts
updateResult(): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:735](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L735)
Recomputes and stores the current result from the current query/options, notifying listeners
if it changed. Framework adapters call this right after subscribing to make sure no query
update was missed in the gap between creating the observer and subscribing to it.
#### Returns
`void`
#### Inherited from
[`QueryObserver`](QueryObserver.md).[`updateResult`](QueryObserver.md#updateresult)

View File

@@ -0,0 +1,330 @@
---
id: Mutation
title: Mutation
---
Defined in: [packages/query-core/src/mutation.ts:135](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutation.ts#L135)
Represents a single mutation attempt. A `Mutation` holds the mutation's
options, state (data/error/status), and the `MutationObserver`s currently
subscribed to it.
Instances are created and managed internally by `MutationCache`; application
code typically interacts with mutations indirectly through `QueryClient` or
a framework hook like `useMutation`. Direct access to a `Mutation` instance
is possible via `mutationCache.find()`/`getAll()` for inspecting cache state.
## Example
```ts
const mutationCache = queryClient.getMutationCache()
const mutation = mutationCache.find({ mutationKey: ['addPost'] })
```
## Extends
- `Removable`
## Type Parameters
### TData
`TData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
### TVariables
`TVariables` = `unknown`
### TOnMutateResult
`TOnMutateResult` = `unknown`
## Constructors
### Constructor
```ts
new Mutation<TData, TError, TVariables, TOnMutateResult>(config): Mutation<TData, TError, TVariables, TOnMutateResult>;
```
Defined in: [packages/query-core/src/mutation.ts:152](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutation.ts#L152)
#### Parameters
##### config
`MutationConfig`\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>
#### Returns
`Mutation`\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>
#### Overrides
```ts
Removable.constructor
```
## Properties
### gcTime
```ts
gcTime: number;
```
Defined in: [packages/query-core/src/removable.ts:7](https://github.com/TanStack/query/blob/main/packages/query-core/src/removable.ts#L7)
#### Inherited from
```ts
Removable.gcTime
```
***
### mutationId
```ts
readonly mutationId: number;
```
Defined in: [packages/query-core/src/mutation.ts:143](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutation.ts#L143)
***
### options
```ts
options: MutationOptions<TData, TError, TVariables, TOnMutateResult>;
```
Defined in: [packages/query-core/src/mutation.ts:142](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutation.ts#L142)
***
### state
```ts
state: MutationState<TData, TError, TVariables, TOnMutateResult>;
```
Defined in: [packages/query-core/src/mutation.ts:141](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutation.ts#L141)
## Accessors
### meta
#### Get Signature
```ts
get meta(): Record<string, unknown> | undefined;
```
Defined in: [packages/query-core/src/mutation.ts:179](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutation.ts#L179)
The `meta` object passed in the mutation's options, if any.
##### Returns
`Record`\<`string`, `unknown`\> \| `undefined`
## Methods
### clearGcTimeout()
```ts
protected clearGcTimeout(): void;
```
Defined in: [packages/query-core/src/removable.ts:32](https://github.com/TanStack/query/blob/main/packages/query-core/src/removable.ts#L32)
#### Returns
`void`
#### Inherited from
```ts
Removable.clearGcTimeout
```
***
### continue()
```ts
continue(): Promise<unknown>;
```
Defined in: [packages/query-core/src/mutation.ts:243](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutation.ts#L243)
Resumes a mutation that is currently paused or was restored from a
dehydrated, still-`pending` state.
- If this mutation has an active retryer (it paused mid-attempt, e.g. due
to the network mode or scope-based queuing), its retryer is resumed.
- Otherwise, if the mutation's status is still `pending` (e.g. it was
dehydrated while an attempt was in flight and never got a retryer in
this instance), `execute` is called again with the last known variables.
- Otherwise the mutation has already settled and this resolves immediately
without running anything again.
#### Returns
`Promise`\<`unknown`\>
#### Example
```ts
// typically driven by reconnect handling, e.g. queryClient.resumePausedMutations()
const mutation = mutationCache.find({ mutationKey: ['addPost'] })
await mutation?.continue()
```
#### See
[Mutation#execute](#execute)
***
### destroy()
```ts
destroy(): void;
```
Defined in: [packages/query-core/src/removable.ts:10](https://github.com/TanStack/query/blob/main/packages/query-core/src/removable.ts#L10)
#### Returns
`void`
#### Inherited from
```ts
Removable.destroy
```
***
### execute()
```ts
execute(variables): Promise<TData>;
```
Defined in: [packages/query-core/src/mutation.ts:284](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutation.ts#L284)
Runs the mutation function for the given variables through a retryer, and
drives the mutation's state and lifecycle callbacks through to settlement.
If this mutation's state is already `pending` when `execute` is called
(i.e. it was restored, still in-flight, from a dehydrated state), the
`onMutate` step is skipped and a `continue` action is dispatched to
unpause it; otherwise a `pending` action is dispatched first, then the
mutation cache's `onMutate` and the mutation's own `onMutate` option are
awaited in that order, and the resulting context is stored.
The mutation function is then run (subject to `retry`/`retryDelay`/
`networkMode`, and to the mutation cache's scope-based serialization).
On success, the cache's `onSuccess`/`onSettled` callbacks run before the
mutation's own `onSuccess`/`onSettled` options, a `success` action is
dispatched, and the resolved data is returned. On failure, the same
cache-then-option ordering is used for `onError`/`onSettled`, but each of
those four callbacks is individually caught so that a throwing callback
cannot mask the original error; an `error` action is then dispatched and
the original error is re-thrown.
#### Parameters
##### variables
`TVariables`
#### Returns
`Promise`\<`TData`\>
#### Example
```ts
// Called internally by `MutationObserver.mutate` and `Mutation.continue` —
// applications normally trigger mutations through those, not this method.
const data = await mutation.execute(variables)
```
#### See
[Mutation#continue](#continue)
***
### optionalRemove()
```ts
protected optionalRemove(): void;
```
Defined in: [packages/query-core/src/mutation.ts:212](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutation.ts#L212)
#### Returns
`void`
#### Overrides
```ts
Removable.optionalRemove
```
***
### scheduleGc()
```ts
protected scheduleGc(): void;
```
Defined in: [packages/query-core/src/removable.ts:14](https://github.com/TanStack/query/blob/main/packages/query-core/src/removable.ts#L14)
#### Returns
`void`
#### Inherited from
```ts
Removable.scheduleGc
```
***
### updateGcTime()
```ts
protected updateGcTime(newGcTime): void;
```
Defined in: [packages/query-core/src/removable.ts:24](https://github.com/TanStack/query/blob/main/packages/query-core/src/removable.ts#L24)
#### Parameters
##### newGcTime
`number` | `undefined`
#### Returns
`void`
#### Inherited from
```ts
Removable.updateGcTime
```

View File

@@ -0,0 +1,316 @@
---
id: MutationCache
title: MutationCache
---
Defined in: [packages/query-core/src/mutationCache.ts:124](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationCache.ts#L124)
The `MutationCache` is the storage for mutations.
Normally, you will not interact with the `MutationCache` directly and instead use a
`QueryClient`. You can subscribe to it (inherited from `Subscribable`) to be informed of
safe/known updates to the cache, such as mutations being added, removed, or updated.
## Example
```ts
const unsubscribe = mutationCache.subscribe((event) => {
console.log(event.type, event.mutation)
})
```
## Extends
- `Subscribable`\<`MutationCacheListener`\>
## Constructors
### Constructor
```ts
new MutationCache(config): MutationCache;
```
Defined in: [packages/query-core/src/mutationCache.ts:129](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationCache.ts#L129)
#### Parameters
##### config
[`MutationCacheConfig`](../interfaces/MutationCacheConfig.md) = `{}`
#### Returns
`MutationCache`
#### Overrides
```ts
Subscribable<MutationCacheListener>.constructor
```
## Properties
### config
```ts
config: MutationCacheConfig = {};
```
Defined in: [packages/query-core/src/mutationCache.ts:129](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationCache.ts#L129)
***
### listeners
```ts
protected listeners: Set<MutationCacheListener>;
```
Defined in: [packages/query-core/src/subscribable.ts:2](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L2)
#### Inherited from
```ts
Subscribable.listeners
```
## Methods
### clear()
```ts
clear(): void;
```
Defined in: [packages/query-core/src/mutationCache.ts:236](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationCache.ts#L236)
Removes all mutations from the cache.
#### Returns
`void`
#### Example
```ts
const mutationCache = queryClient.getMutationCache()
mutationCache.clear()
```
***
### find()
```ts
find<TData, TError, TVariables, TOnMutateResult>(filters):
| Mutation<TData, TError, TVariables, TOnMutateResult>
| undefined;
```
Defined in: [packages/query-core/src/mutationCache.ts:278](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationCache.ts#L278)
A slightly more advanced method that can be used to get an existing mutation instance from
the cache. If the mutation does not exist, `undefined` is returned.
This is not typically needed for most applications, but can come in handy when needing more
information about a mutation in rare scenarios.
#### Type Parameters
##### TData
`TData` = `unknown`
##### TError
`TError` = `Error`
##### TVariables
`TVariables` = `any`
##### TOnMutateResult
`TOnMutateResult` = `unknown`
#### Parameters
##### filters
[`MutationFilters`](../interfaces/MutationFilters.md)
#### Returns
\| [`Mutation`](Mutation.md)\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>
\| `undefined`
#### See
[MutationCache#findAll](#findall)
#### Example
```ts
const mutationCache = queryClient.getMutationCache()
const mutation = mutationCache.find({ mutationKey: ['addPost'] })
```
***
### findAll()
```ts
findAll(filters): Mutation<unknown, Error, unknown, unknown>[];
```
Defined in: [packages/query-core/src/mutationCache.ts:308](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationCache.ts#L308)
An even more advanced method that can be used to get existing mutation instances from the
cache that match the given filters. If no mutations match, an empty array is returned.
This is not typically needed for most applications, but can come in handy when needing more
information about mutations in rare scenarios.
#### Parameters
##### filters
[`MutationFilters`](../interfaces/MutationFilters.md) = `{}`
#### Returns
[`Mutation`](Mutation.md)\<`unknown`, `Error`, `unknown`, `unknown`\>[]
#### See
[MutationCache#find](#find)
#### Example
```ts
const mutationCache = queryClient.getMutationCache()
const mutations = mutationCache.findAll({ mutationKey: ['addPost'] })
```
***
### getAll()
```ts
getAll(): Mutation<unknown, Error, unknown, unknown>[];
```
Defined in: [packages/query-core/src/mutationCache.ts:259](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationCache.ts#L259)
Returns all mutations within the cache.
This is not typically needed for most applications, but can come in handy when needing more
information about a mutation in rare scenarios.
#### Returns
[`Mutation`](Mutation.md)\<`unknown`, `Error`, `unknown`, `unknown`\>[]
#### Example
```ts
const mutationCache = queryClient.getMutationCache()
const mutations = mutationCache.getAll()
```
***
### hasListeners()
```ts
hasListeners(): boolean;
```
Defined in: [packages/query-core/src/subscribable.ts:19](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L19)
#### Returns
`boolean`
#### Inherited from
```ts
Subscribable.hasListeners
```
***
### onSubscribe()
```ts
protected onSubscribe(): void;
```
Defined in: [packages/query-core/src/subscribable.ts:23](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L23)
#### Returns
`void`
#### Inherited from
```ts
Subscribable.onSubscribe
```
***
### onUnsubscribe()
```ts
protected onUnsubscribe(): void;
```
Defined in: [packages/query-core/src/subscribable.ts:27](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L27)
#### Returns
`void`
#### Inherited from
```ts
Subscribable.onUnsubscribe
```
***
### subscribe()
```ts
subscribe(listener): () => void;
```
Defined in: [packages/query-core/src/subscribable.ts:8](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L8)
#### Parameters
##### listener
`MutationCacheListener`
#### Returns
```ts
(): void;
```
##### Returns
`void`
#### Inherited from
```ts
Subscribable.subscribe
```

View File

@@ -0,0 +1,335 @@
---
id: MutationObserver
title: MutationObserver
---
Defined in: [packages/query-core/src/mutationObserver.ts:38](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationObserver.ts#L38)
Observes a single mutation and derives a `MutationObserverResult` from it.
A framework hook like `useMutation` creates one `MutationObserver` per hook
call, keeps it stable across re-renders, calls `setOptions` when the options
passed to the hook change, subscribes to it to re-render on updates, and
reads `getCurrentResult()` for the value to return. Calling `mutate()`
builds a new underlying `Mutation` in the `MutationCache` and executes it.
## Example
```ts
const observer = new MutationObserver(queryClient, {
mutationFn: (variables: { title: string }) => addPost(variables),
})
```
## Extends
- `Subscribable`\<`MutationObserverListener`\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>\>
## Type Parameters
### TData
`TData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
### TVariables
`TVariables` = `void`
### TOnMutateResult
`TOnMutateResult` = `unknown`
## Constructors
### Constructor
```ts
new MutationObserver<TData, TError, TVariables, TOnMutateResult>(client, options): MutationObserver<TData, TError, TVariables, TOnMutateResult>;
```
Defined in: [packages/query-core/src/mutationObserver.ts:58](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationObserver.ts#L58)
#### Parameters
##### client
`QueryClient`
##### options
[`MutationObserverOptions`](../interfaces/MutationObserverOptions.md)\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>
#### Returns
`MutationObserver`\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>
#### Overrides
```ts
Subscribable<
MutationObserverListener<TData, TError, TVariables, TOnMutateResult>
>.constructor
```
## Properties
### listeners
```ts
protected listeners: Set<MutationObserverListener<TData, TError, TVariables, TOnMutateResult>>;
```
Defined in: [packages/query-core/src/subscribable.ts:2](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L2)
#### Inherited from
```ts
Subscribable.listeners
```
***
### options
```ts
options: MutationObserverOptions<TData, TError, TVariables, TOnMutateResult>;
```
Defined in: [packages/query-core/src/mutationObserver.ts:46](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationObserver.ts#L46)
## Methods
### bindMethods()
```ts
protected bindMethods(): void;
```
Defined in: [packages/query-core/src/mutationObserver.ts:75](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationObserver.ts#L75)
#### Returns
`void`
***
### getCurrentResult()
```ts
getCurrentResult(): MutationObserverResult<TData, TError, TVariables, TOnMutateResult>;
```
Defined in: [packages/query-core/src/mutationObserver.ts:155](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationObserver.ts#L155)
Returns the observer's current result, derived from the observed
mutation's state (or the default, `idle` state if no mutation has been
built yet, e.g. before the first `mutate()` call or after `reset()`).
#### Returns
[`MutationObserverResult`](../type-aliases/MutationObserverResult.md)\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>
***
### hasListeners()
```ts
hasListeners(): boolean;
```
Defined in: [packages/query-core/src/subscribable.ts:19](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L19)
#### Returns
`boolean`
#### Inherited from
```ts
Subscribable.hasListeners
```
***
### mutate()
```ts
mutate(variables, options?): Promise<TData>;
```
Defined in: [packages/query-core/src/mutationObserver.ts:207](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationObserver.ts#L207)
Builds a new `Mutation` in the `MutationCache` using the observer's
current options, detaches this observer from any previously observed
mutation, attaches it to the new one, and executes it with the given
variables.
The optional per-call `options` (`onSuccess`/`onError`/`onSettled`) are
invoked once the mutation settles, in addition to any callbacks defined
on the observer's own options.
#### Parameters
##### variables
`TVariables`
##### options?
[`MutateOptions`](../interfaces/MutateOptions.md)\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>
#### Returns
`Promise`\<`TData`\>
#### Example
```ts
await observer.mutate(
{ title: 'New post' },
{ onSuccess: (data) => console.log(data) },
)
```
***
### onSubscribe()
```ts
protected onSubscribe(): void;
```
Defined in: [packages/query-core/src/mutationObserver.ts:127](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationObserver.ts#L127)
#### Returns
`void`
#### Overrides
```ts
Subscribable.onSubscribe
```
***
### onUnsubscribe()
```ts
protected onUnsubscribe(): void;
```
Defined in: [packages/query-core/src/mutationObserver.ts:135](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationObserver.ts#L135)
#### Returns
`void`
#### Overrides
```ts
Subscribable.onUnsubscribe
```
***
### reset()
```ts
reset(): void;
```
Defined in: [packages/query-core/src/mutationObserver.ts:180](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationObserver.ts#L180)
Detaches the observer from the mutation it is currently observing (if
any) and resets the observed result back to its default, `idle` state.
This does not cancel an in-flight mutation; the mutation itself keeps
running to completion and its own callbacks still fire, but this
observer stops reflecting its state and a subsequent `mutate()` call
will build a brand new mutation.
#### Returns
`void`
#### Example
```ts
observer.reset()
```
#### See
[MutationObserver#mutate](#mutate)
***
### setOptions()
```ts
setOptions(options): void;
```
Defined in: [packages/query-core/src/mutationObserver.ts:96](https://github.com/TanStack/query/blob/main/packages/query-core/src/mutationObserver.ts#L96)
Updates the observer's options.
If the new `mutationKey` differs from the previous one (and both were
defined), the observer is reset, detaching it from the mutation it was
observing. Otherwise, if the currently observed mutation is still
`pending`, its options are updated in place as well.
#### Parameters
##### options
[`MutationObserverOptions`](../interfaces/MutationObserverOptions.md)\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>
#### Returns
`void`
#### Example
```ts
observer.setOptions({
mutationFn: (variables: { title: string }) => addPost(variables),
onSuccess: (data) => console.log(data),
})
```
***
### subscribe()
```ts
subscribe(listener): () => void;
```
Defined in: [packages/query-core/src/subscribable.ts:8](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L8)
#### Parameters
##### listener
`MutationObserverListener`
#### Returns
```ts
(): void;
```
##### Returns
`void`
#### Inherited from
```ts
Subscribable.subscribe
```

View File

@@ -0,0 +1,325 @@
---
id: QueriesObserver
title: QueriesObserver
---
Defined in: [packages/query-core/src/queriesObserver.ts:56](https://github.com/TanStack/query/blob/main/packages/query-core/src/queriesObserver.ts#L56)
A `QueriesObserver` watches an array of queries at once, exposing them as
a single array of `QueryObserverResult`s (or, when a `combine` option is
given, as a combined value derived from that array). It manages one
internal `QueryObserver` per query, and is the primitive that framework
adapters (e.g. `useQueries`) build their hooks on top of.
## Example
```ts
const observer = new QueriesObserver(queryClient, [
{ queryKey: ['post', 1], queryFn: fetchPost },
{ queryKey: ['post', 2], queryFn: fetchPost },
])
const unsubscribe = observer.subscribe((result) => {
console.log(result)
})
```
## Extends
- `Subscribable`\<`QueriesObserverListener`\>
## Type Parameters
### TCombinedResult
`TCombinedResult` = [`QueryObserverResult`](../type-aliases/QueryObserverResult.md)[]
## Constructors
### Constructor
```ts
new QueriesObserver<TCombinedResult>(
client,
queries,
options?): QueriesObserver<TCombinedResult>;
```
Defined in: [packages/query-core/src/queriesObserver.ts:70](https://github.com/TanStack/query/blob/main/packages/query-core/src/queriesObserver.ts#L70)
#### Parameters
##### client
`QueryClient`
##### queries
`QueryObserverOptions`\<`any`, `any`, `any`, `any`, `any`, `never`\>[]
##### options?
[`QueriesObserverOptions`](../interfaces/QueriesObserverOptions.md)\<`TCombinedResult`\>
#### Returns
`QueriesObserver`\<`TCombinedResult`\>
#### Overrides
```ts
Subscribable<QueriesObserverListener>.constructor
```
## Properties
### listeners
```ts
protected listeners: Set<QueriesObserverListener>;
```
Defined in: [packages/query-core/src/subscribable.ts:2](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L2)
#### Inherited from
```ts
Subscribable.listeners
```
## Methods
### destroy()
```ts
destroy(): void;
```
Defined in: [packages/query-core/src/queriesObserver.ts:106](https://github.com/TanStack/query/blob/main/packages/query-core/src/queriesObserver.ts#L106)
Stops observing all queries: clears all listeners and destroys every
underlying `QueryObserver` this observer manages.
#### Returns
`void`
***
### getCurrentResult()
```ts
getCurrentResult(): QueryObserverResult[];
```
Defined in: [packages/query-core/src/queriesObserver.ts:210](https://github.com/TanStack/query/blob/main/packages/query-core/src/queriesObserver.ts#L210)
Returns the most recently computed array of `QueryObserverResult`s, one
per observed query, in the same order as the queries passed to the
constructor or `setQueries`.
#### Returns
[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)[]
#### Example
```ts
const results = observer.getCurrentResult()
const data = results.map((result) => result.data)
```
***
### getObservers()
```ts
getObservers(): QueryObserver<unknown, Error, unknown, unknown, readonly unknown[]>[];
```
Defined in: [packages/query-core/src/queriesObserver.ts:227](https://github.com/TanStack/query/blob/main/packages/query-core/src/queriesObserver.ts#L227)
Returns the underlying `QueryObserver` instances this observer manages,
in the same order as the queries passed to the constructor or
`setQueries`.
#### Returns
[`QueryObserver`](QueryObserver.md)\<`unknown`, `Error`, `unknown`, `unknown`, readonly `unknown`[]\>[]
***
### getOptimisticResult()
```ts
getOptimisticResult(queries, combine): [QueryObserverResult[], (r?) => TCombinedResult, () => QueryObserverResult[]];
```
Defined in: [packages/query-core/src/queriesObserver.ts:238](https://github.com/TanStack/query/blob/main/packages/query-core/src/queriesObserver.ts#L238)
The `QueriesObserver` counterpart of [QueryObserver#getOptimisticResult](QueryObserver.md#getoptimisticresult) — computes
the result for the given (already-defaulted) queries right now, synchronously. Called by
framework adapters (e.g. `useQueries`) ahead of subscribing, returning a tuple of the raw
per-query results, a function to compute the combined result from them, and a function to
wrap the results for property-access tracking.
#### Parameters
##### queries
`QueryObserverOptions`\<`unknown`, `Error`, `unknown`, `unknown`, readonly `unknown`[], `never`\>[]
##### combine
`CombineFn`\<`TCombinedResult`\> | `undefined`
#### Returns
\[[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)[], (`r?`) => `TCombinedResult`, () => [`QueryObserverResult`](../type-aliases/QueryObserverResult.md)[]\]
***
### getQueries()
```ts
getQueries(): Query<unknown, Error, unknown, readonly unknown[]>[];
```
Defined in: [packages/query-core/src/queriesObserver.ts:218](https://github.com/TanStack/query/blob/main/packages/query-core/src/queriesObserver.ts#L218)
Returns the underlying `Query` instances currently being observed, in
the same order as the queries passed to the constructor or `setQueries`.
#### Returns
[`Query`](Query.md)\<`unknown`, `Error`, `unknown`, readonly `unknown`[]\>[]
***
### hasListeners()
```ts
hasListeners(): boolean;
```
Defined in: [packages/query-core/src/subscribable.ts:19](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L19)
#### Returns
`boolean`
#### Inherited from
```ts
Subscribable.hasListeners
```
***
### onSubscribe()
```ts
protected onSubscribe(): void;
```
Defined in: [packages/query-core/src/queriesObserver.ts:86](https://github.com/TanStack/query/blob/main/packages/query-core/src/queriesObserver.ts#L86)
#### Returns
`void`
#### Overrides
```ts
Subscribable.onSubscribe
```
***
### onUnsubscribe()
```ts
protected onUnsubscribe(): void;
```
Defined in: [packages/query-core/src/queriesObserver.ts:96](https://github.com/TanStack/query/blob/main/packages/query-core/src/queriesObserver.ts#L96)
#### Returns
`void`
#### Overrides
```ts
Subscribable.onUnsubscribe
```
***
### setQueries()
```ts
setQueries(queries, options?): void;
```
Defined in: [packages/query-core/src/queriesObserver.ts:127](https://github.com/TanStack/query/blob/main/packages/query-core/src/queriesObserver.ts#L127)
Replaces the set of queries being observed. Existing `QueryObserver`s
are reused for queries that match an already-observed query hash;
observers for queries that are no longer present are destroyed, and new
observers are created and subscribed to for newly added queries.
#### Parameters
##### queries
`QueryObserverOptions`\<`unknown`, `Error`, `unknown`, `unknown`, readonly `unknown`[], `never`\>[]
##### options?
[`QueriesObserverOptions`](../interfaces/QueriesObserverOptions.md)\<`TCombinedResult`\>
#### Returns
`void`
#### Example
```ts
observer.setQueries([
{ queryKey: ['post', 1], queryFn: fetchPost },
{ queryKey: ['post', 3], queryFn: fetchPost },
])
```
***
### subscribe()
```ts
subscribe(listener): () => void;
```
Defined in: [packages/query-core/src/subscribable.ts:8](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L8)
#### Parameters
##### listener
`QueriesObserverListener`
#### Returns
```ts
(): void;
```
##### Returns
`void`
#### Inherited from
```ts
Subscribable.subscribe
```

View File

@@ -0,0 +1,585 @@
---
id: Query
title: Query
---
Defined in: [packages/query-core/src/query.ts:225](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L225)
Represents a single cached query. A `Query` holds the query's key, options,
state (data/error/status), and the observers currently subscribed to it.
Instances are created and managed internally by `QueryCache`; application
code typically interacts with queries indirectly through `QueryClient` or
a framework hook like `useQuery`. Direct access to a `Query` instance is
possible via `queryCache.find()`/`findAll()` for inspecting cache state.
## Example
```ts
const queryCache = queryClient.getQueryCache()
const query = queryCache.find({ queryKey: ['posts'] })
if (query) {
console.log(query.state.dataUpdatedAt)
}
```
## Extends
- `Removable`
## Type Parameters
### TQueryFnData
`TQueryFnData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
### TData
`TData` = `TQueryFnData`
### TQueryKey
`TQueryKey` *extends* [`QueryKey`](../type-aliases/QueryKey.md) = [`QueryKey`](../type-aliases/QueryKey.md)
## Constructors
### Constructor
```ts
new Query<TQueryFnData, TError, TData, TQueryKey>(config): Query<TQueryFnData, TError, TData, TQueryKey>;
```
Defined in: [packages/query-core/src/query.ts:246](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L246)
#### Parameters
##### config
`QueryConfig`\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\>
#### Returns
`Query`\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\>
#### Overrides
```ts
Removable.constructor
```
## Properties
### gcTime
```ts
gcTime: number;
```
Defined in: [packages/query-core/src/removable.ts:7](https://github.com/TanStack/query/blob/main/packages/query-core/src/removable.ts#L7)
#### Inherited from
```ts
Removable.gcTime
```
***
### observers
```ts
observers: QueryObserver<any, any, any, any, any>[];
```
Defined in: [packages/query-core/src/query.ts:242](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L242)
***
### options
```ts
options: QueryOptions<TQueryFnData, TError, TData, TQueryKey>;
```
Defined in: [packages/query-core/src/query.ts:233](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L233)
***
### queryHash
```ts
queryHash: string;
```
Defined in: [packages/query-core/src/query.ts:232](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L232)
***
### queryKey
```ts
queryKey: TQueryKey;
```
Defined in: [packages/query-core/src/query.ts:231](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L231)
***
### state
```ts
state: QueryState<TData, TError>;
```
Defined in: [packages/query-core/src/query.ts:234](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L234)
## Accessors
### meta
#### Get Signature
```ts
get meta(): Record<string, unknown> | undefined;
```
Defined in: [packages/query-core/src/query.ts:264](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L264)
The `meta` object passed in the query's options, if any.
##### Returns
`Record`\<`string`, `unknown`\> \| `undefined`
***
### promise
#### Get Signature
```ts
get promise(): Promise<TData> | undefined;
```
Defined in: [packages/query-core/src/query.ts:277](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L277)
The promise for the currently in-flight fetch, if the query is fetching.
`undefined` when the query is not fetching.
##### Returns
`Promise`\<`TData`\> \| `undefined`
## Methods
### cancel()
```ts
cancel(options?): Promise<void>;
```
Defined in: [packages/query-core/src/query.ts:348](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L348)
Cancels the query's currently in-flight fetch, if any.
- Returns a promise that resolves once the cancellation has settled.
- If no fetch is in progress, resolves immediately.
#### Parameters
##### options?
[`CancelOptions`](../interfaces/CancelOptions.md)
#### Returns
`Promise`\<`void`\>
#### Example
```ts
await query.cancel()
```
***
### clearGcTimeout()
```ts
protected clearGcTimeout(): void;
```
Defined in: [packages/query-core/src/removable.ts:32](https://github.com/TanStack/query/blob/main/packages/query-core/src/removable.ts#L32)
#### Returns
`void`
#### Inherited from
```ts
Removable.clearGcTimeout
```
***
### destroy()
```ts
destroy(): void;
```
Defined in: [packages/query-core/src/query.ts:361](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L361)
Clears the query's garbage collection timeout and silently cancels any
in-flight fetch. Called by `QueryCache` when the query is removed from
the cache.
#### Returns
`void`
#### See
[Query#cancel](#cancel)
#### Overrides
```ts
Removable.destroy
```
***
### fetch()
```ts
fetch(options?, fetchOptions?): Promise<TData>;
```
Defined in: [packages/query-core/src/query.ts:590](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L590)
Fetches the query, i.e. runs its `queryFn` (through any configured
retryer/behavior) and updates the query's state with the result.
- If a fetch is already in flight, returns its promise instead of
starting a new one, unless `fetchOptions.cancelRefetch` is set and the
query already has data, in which case the current fetch is silently
cancelled first.
- If `options` is passed, it replaces the query's current options
before fetching.
#### Parameters
##### options?
`QueryOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `never`\>
##### fetchOptions?
`FetchOptions`\<`TQueryFnData`\>
#### Returns
`Promise`\<`TData`\>
***
### getObserversCount()
```ts
getObserversCount(): number;
```
Defined in: [packages/query-core/src/query.ts:560](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L560)
Returns the number of observers currently subscribed to this query.
#### Returns
`number`
#### Example
```ts
if (query.getObserversCount() === 0) {
// no component is currently watching this query
}
```
***
### invalidate()
```ts
invalidate(): void;
```
Defined in: [packages/query-core/src/query.ts:574](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L574)
Marks the query as invalidated, unless it is already invalidated. This
updates `state.isInvalidated` and notifies observers, but does not by
itself trigger a refetch.
#### Returns
`void`
#### Example
```ts
query.invalidate()
```
***
### isActive()
```ts
isActive(): boolean;
```
Defined in: [packages/query-core/src/query.ts:386](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L386)
Returns `true` if the query has at least one observer for which `enabled`
does not resolve to `false`.
#### Returns
`boolean`
***
### isDisabled()
```ts
isDisabled(): boolean;
```
Defined in: [packages/query-core/src/query.ts:400](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L400)
Returns `true` if the query is disabled, meaning it will not fetch
automatically.
- If the query has observers, it is disabled when none of them are active
(see `isActive`).
- If the query has no observers, it is disabled when its `queryFn` is
`skipToken` or it has never been fetched.
#### Returns
`boolean`
***
### isFetched()
```ts
isFetched(): boolean;
```
Defined in: [packages/query-core/src/query.ts:412](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L412)
Returns `true` if the query has been fetched, i.e. it has resolved with
either data or an error at least once.
#### Returns
`boolean`
***
### isStale()
```ts
isStale(): boolean;
```
Defined in: [packages/query-core/src/query.ts:447](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L447)
Returns `true` if the query is stale.
- If the query has observers, defers to whether any observer's current
result reports `isStale` (which accounts for each observer's own
`staleTime` and `enabled` state).
- If the query has no observers, it is considered stale when it has no
data or has been invalidated.
#### Returns
`boolean`
#### See
[Query#isStaleByTime](#isstalebytime)
#### Example
```ts
if (query.isStale()) {
// refetch or otherwise treat the cached data as outdated
}
```
***
### isStaleByTime()
```ts
isStaleByTime(staleTime): boolean;
```
Defined in: [packages/query-core/src/query.ts:473](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L473)
Returns `true` if the query's data is stale relative to the given
`staleTime` (defaults to `0`).
- A query with no data is always stale.
- `staleTime: 'static'` is never stale.
- An invalidated query is always stale.
- Otherwise, staleness is based on elapsed time since `dataUpdatedAt`.
#### Parameters
##### staleTime
[`StaleTime`](../type-aliases/StaleTime.md) = `0`
#### Returns
`boolean`
#### See
[Query#isStale](#isstale)
#### Example
```ts
const isStale = query.isStaleByTime(1000 * 60)
```
***
### isStatic()
```ts
isStatic(): boolean;
```
Defined in: [packages/query-core/src/query.ts:420](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L420)
Returns `true` if the query has at least one observer configured with
`staleTime: 'static'`, meaning it is treated as never stale.
#### Returns
`boolean`
***
### optionalRemove()
```ts
protected optionalRemove(): void;
```
Defined in: [packages/query-core/src/query.ts:305](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L305)
#### Returns
`void`
#### Overrides
```ts
Removable.optionalRemove
```
***
### reset()
```ts
reset(): void;
```
Defined in: [packages/query-core/src/query.ts:377](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L377)
Resets the query back to its initial state (the state it had when it was
first created, e.g. any `initialData`), destroying it first to cancel any
in-flight fetch.
#### Returns
`void`
***
### scheduleGc()
```ts
protected scheduleGc(): void;
```
Defined in: [packages/query-core/src/removable.ts:14](https://github.com/TanStack/query/blob/main/packages/query-core/src/removable.ts#L14)
#### Returns
`void`
#### Inherited from
```ts
Removable.scheduleGc
```
***
### setState()
```ts
setState(state): void;
```
Defined in: [packages/query-core/src/query.ts:334](https://github.com/TanStack/query/blob/main/packages/query-core/src/query.ts#L334)
Merges the given partial state directly into this query's state, notifying observers. Used
by persistence and broadcast plugins to restore a state snapshot, and by devtools to let a
user manually trigger a loading/error state or edit the cached data.
#### Parameters
##### state
`Partial`\<[`QueryState`](../interfaces/QueryState.md)\<`TData`, `TError`\>\>
#### Returns
`void`
***
### updateGcTime()
```ts
protected updateGcTime(newGcTime): void;
```
Defined in: [packages/query-core/src/removable.ts:24](https://github.com/TanStack/query/blob/main/packages/query-core/src/removable.ts#L24)
#### Parameters
##### newGcTime
`number` | `undefined`
#### Returns
`void`
#### Inherited from
```ts
Removable.updateGcTime
```

View File

@@ -0,0 +1,471 @@
---
id: QueryCache
title: QueryCache
---
Defined in: [packages/query-core/src/queryCache.ts:123](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryCache.ts#L123)
The `QueryCache` is the storage mechanism for TanStack Query. It stores all the data, meta
information, and state of the queries it contains.
Normally, you will not interact with the `QueryCache` directly and instead use a `QueryClient`
for a specific cache. You can subscribe to it (inherited from `Subscribable`) to be informed of
safe/known updates to the cache, such as queries being added, removed, or updated — updates made
outside of the cache's own tracked mechanisms (e.g. mutating a query's state object directly) do
not notify subscribers.
## Example
```ts
const unsubscribe = queryCache.subscribe((event) => {
console.log(event.type, event.query)
})
```
## Extends
- `Subscribable`\<`QueryCacheListener`\>
## Constructors
### Constructor
```ts
new QueryCache(config): QueryCache;
```
Defined in: [packages/query-core/src/queryCache.ts:126](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryCache.ts#L126)
#### Parameters
##### config
[`QueryCacheConfig`](../interfaces/QueryCacheConfig.md) = `{}`
#### Returns
`QueryCache`
#### Overrides
```ts
Subscribable<QueryCacheListener>.constructor
```
## Properties
### config
```ts
config: QueryCacheConfig = {};
```
Defined in: [packages/query-core/src/queryCache.ts:126](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryCache.ts#L126)
***
### listeners
```ts
protected listeners: Set<QueryCacheListener>;
```
Defined in: [packages/query-core/src/subscribable.ts:2](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L2)
#### Inherited from
```ts
Subscribable.listeners
```
## Methods
### build()
```ts
build<TQueryFnData, TError, TData, TQueryKey>(
client,
options,
state?): Query<TQueryFnData, TError, TData, TQueryKey>;
```
Defined in: [packages/query-core/src/queryCache.ts:147](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryCache.ts#L147)
Returns the existing `Query` instance for the given options' `queryKey`/`queryHash`, or
builds and adds a new one to the cache if none exists yet. Used by framework adapters and
plugins (e.g. broadcast/persistence) that need to get-or-create a `Query` directly, bypassing
the reactive `QueryObserver` machinery.
#### Type Parameters
##### TQueryFnData
`TQueryFnData` = `unknown`
##### TError
`TError` = `Error`
##### TData
`TData` = `TQueryFnData`
##### TQueryKey
`TQueryKey` *extends* readonly `unknown`[] = readonly `unknown`[]
#### Parameters
##### client
`QueryClient`
##### options
[`WithRequired`](../type-aliases/WithRequired.md)\<`QueryOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `never`\>, `"queryKey"`\>
##### state?
[`QueryState`](../interfaces/QueryState.md)\<`TData`, `TError`\>
#### Returns
[`Query`](Query.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\>
#### Example
```ts
const queryCache = queryClient.getQueryCache()
const query = queryCache.build(queryClient, {
queryKey: ['posts'],
queryFn: fetchPosts,
})
```
***
### clear()
```ts
clear(): void;
```
Defined in: [packages/query-core/src/queryCache.ts:232](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryCache.ts#L232)
Removes all queries from the cache.
#### Returns
`void`
#### Example
```ts
const queryCache = queryClient.getQueryCache()
queryCache.clear()
```
***
### find()
```ts
find<TQueryFnData, TError, TData>(filters):
| Query<TQueryFnData, TError, TData, readonly unknown[]>
| undefined;
```
Defined in: [packages/query-core/src/queryCache.ts:299](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryCache.ts#L299)
A slightly more advanced method that can be used to get an existing query instance from the
cache. This instance not only contains all the state for the query, but all of the instances,
and underlying guts of the query as well. If the query does not exist, `undefined` is
returned.
This is not typically needed for most applications, but can come in handy when needing more
information about a query in rare scenarios (e.g. looking at `query.state.dataUpdatedAt` to
decide whether a query is fresh enough to be used as an initial value).
#### Type Parameters
##### TQueryFnData
`TQueryFnData` = `unknown`
##### TError
`TError` = `Error`
##### TData
`TData` = `TQueryFnData`
#### Parameters
##### filters
[`WithRequired`](../type-aliases/WithRequired.md)\<[`QueryFilters`](../interfaces/QueryFilters.md)\<readonly `unknown`[]\>, `"queryKey"`\>
#### Returns
\| [`Query`](Query.md)\<`TQueryFnData`, `TError`, `TData`, readonly `unknown`[]\>
\| `undefined`
#### See
[QueryCache#findAll](#findall)
#### Example
```ts
const queryCache = queryClient.getQueryCache()
const query = queryCache.find({ queryKey: ['posts'] })
```
***
### findAll()
```ts
findAll(filters): Query<unknown, Error, unknown, readonly unknown[]>[];
```
Defined in: [packages/query-core/src/queryCache.ts:324](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryCache.ts#L324)
An even more advanced method that can be used to get existing query instances from the cache
that partially match a query key. If no queries match, an empty array is returned.
This is not typically needed for most applications, but can come in handy when needing more
information about queries in rare scenarios.
#### Parameters
##### filters
[`QueryFilters`](../interfaces/QueryFilters.md)\<`any`\> = `{}`
#### Returns
[`Query`](Query.md)\<`unknown`, `Error`, `unknown`, readonly `unknown`[]\>[]
#### See
[QueryCache#find](#find)
#### Example
```ts
const queryCache = queryClient.getQueryCache()
const queries = queryCache.findAll({ queryKey: ['posts'] })
```
***
### get()
```ts
get<TQueryFnData, TError, TData, TQueryKey>(queryHash):
| Query<TQueryFnData, TError, TData, TQueryKey>
| undefined;
```
Defined in: [packages/query-core/src/queryCache.ts:254](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryCache.ts#L254)
Returns the `Query` instance stored under the given `queryHash`, or `undefined` if none
exists. Unlike [QueryCache#find](#find), this looks up by the already-computed hash rather
than by `QueryFilters`. Used by plugins (e.g. broadcast/hydration) that already have a hash
to look up directly.
#### Type Parameters
##### TQueryFnData
`TQueryFnData` = `unknown`
##### TError
`TError` = `Error`
##### TData
`TData` = `TQueryFnData`
##### TQueryKey
`TQueryKey` *extends* readonly `unknown`[] = readonly `unknown`[]
#### Parameters
##### queryHash
`string`
#### Returns
\| [`Query`](Query.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\>
\| `undefined`
#### Example
```ts
const queryCache = queryClient.getQueryCache()
const queryHash = hashKey(['posts'])
const query = queryCache.get(queryHash)
```
***
### getAll()
```ts
getAll(): Query<unknown, Error, unknown, readonly unknown[]>[];
```
Defined in: [packages/query-core/src/queryCache.ts:277](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryCache.ts#L277)
Returns all queries within the cache.
#### Returns
[`Query`](Query.md)\<`unknown`, `Error`, `unknown`, readonly `unknown`[]\>[]
#### Example
```ts
const queryCache = queryClient.getQueryCache()
const queries = queryCache.getAll()
```
***
### hasListeners()
```ts
hasListeners(): boolean;
```
Defined in: [packages/query-core/src/subscribable.ts:19](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L19)
#### Returns
`boolean`
#### Inherited from
```ts
Subscribable.hasListeners
```
***
### onSubscribe()
```ts
protected onSubscribe(): void;
```
Defined in: [packages/query-core/src/subscribable.ts:23](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L23)
#### Returns
`void`
#### Inherited from
```ts
Subscribable.onSubscribe
```
***
### onUnsubscribe()
```ts
protected onUnsubscribe(): void;
```
Defined in: [packages/query-core/src/subscribable.ts:27](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L27)
#### Returns
`void`
#### Inherited from
```ts
Subscribable.onUnsubscribe
```
***
### remove()
```ts
remove(query): void;
```
Defined in: [packages/query-core/src/queryCache.ts:208](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryCache.ts#L208)
Destroys the given `Query` and removes it from the cache, notifying subscribers with a
`'removed'` event. A no-op if the query is no longer the one currently stored under its hash
(e.g. it was already replaced). Used by plugins (e.g. the broadcast client) that mirror
removals across `QueryCache` instances.
#### Parameters
##### query
[`Query`](Query.md)\<`any`, `any`, `any`, `any`\>
#### Returns
`void`
#### Example
```ts
const queryCache = queryClient.getQueryCache()
const query = queryCache.find({ queryKey: ['posts'] })
if (query) {
queryCache.remove(query)
}
```
***
### subscribe()
```ts
subscribe(listener): () => void;
```
Defined in: [packages/query-core/src/subscribable.ts:8](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L8)
#### Parameters
##### listener
`QueryCacheListener`
#### Returns
```ts
(): void;
```
##### Returns
`void`
#### Inherited from
```ts
Subscribable.subscribe
```

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,555 @@
---
id: QueryObserver
title: QueryObserver
---
Defined in: [packages/query-core/src/queryObserver.ts:57](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L57)
A `QueryObserver` watches a single query in the `QueryCache` and computes a
`QueryObserverResult` from its state, recomputing and notifying subscribers
whenever the underlying query (or the observer's options) changes. It is
the primitive that framework adapters (e.g. `useQuery`) build their hooks
on top of, but it can also be used directly to observe and switch between
queries outside of any framework.
## Example
```ts
const observer = new QueryObserver(queryClient, {
queryKey: ['posts'],
queryFn: fetchPosts,
})
const unsubscribe = observer.subscribe((result) => {
console.log(result.data)
})
```
## Extends
- `Subscribable`\<`QueryObserverListener`\<`TData`, `TError`\>\>
## Extended by
- [`InfiniteQueryObserver`](InfiniteQueryObserver.md)
## Type Parameters
### TQueryFnData
`TQueryFnData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
### TData
`TData` = `TQueryFnData`
### TQueryData
`TQueryData` = `TQueryFnData`
### TQueryKey
`TQueryKey` *extends* [`QueryKey`](../type-aliases/QueryKey.md) = [`QueryKey`](../type-aliases/QueryKey.md)
## Constructors
### Constructor
```ts
new QueryObserver<TQueryFnData, TError, TData, TQueryData, TQueryKey>(client, options): QueryObserver<TQueryFnData, TError, TData, TQueryData, TQueryKey>;
```
Defined in: [packages/query-core/src/queryObserver.ts:87](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L87)
#### Parameters
##### client
`QueryClient`
##### options
`QueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryData`, `TQueryKey`\>
#### Returns
`QueryObserver`\<`TQueryFnData`, `TError`, `TData`, `TQueryData`, `TQueryKey`\>
#### Overrides
```ts
Subscribable<QueryObserverListener<TData, TError>>.constructor
```
## Properties
### listeners
```ts
protected listeners: Set<QueryObserverListener<TData, TError>>;
```
Defined in: [packages/query-core/src/subscribable.ts:2](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L2)
#### Inherited from
```ts
Subscribable.listeners
```
***
### options
```ts
options: QueryObserverOptions<TQueryFnData, TError, TData, TQueryData, TQueryKey>;
```
Defined in: [packages/query-core/src/queryObserver.ts:89](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L89)
## Methods
### bindMethods()
```ts
protected bindMethods(): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:106](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L106)
#### Returns
`void`
***
### createResult()
```ts
protected createResult(query, options): QueryObserverResult<TData, TError>;
```
Defined in: [packages/query-core/src/queryObserver.ts:559](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L559)
#### Parameters
##### query
[`Query`](Query.md)\<`TQueryFnData`, `TError`, `TQueryData`, `TQueryKey`\>
##### options
`QueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryData`, `TQueryKey`\>
#### Returns
[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>
***
### destroy()
```ts
destroy(): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:161](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L161)
Stops observing the current query: clears all listeners, cancels the
stale and refetch-interval timers, and removes this observer from the
query it was observing.
#### Returns
`void`
***
### fetch()
```ts
protected fetch(fetchOptions): Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/queryObserver.ts:448](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L448)
#### Parameters
##### fetchOptions
`ObserverFetchOptions`
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
***
### fetchOptimistic()
```ts
fetchOptimistic(options): Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/queryObserver.ts:395](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L395)
Fetches a query defined by the given options without affecting this
observer's own tracked query or result, and returns a promise that
resolves with the `QueryObserverResult` for that fetch. This is useful
for prefetching data that another observer (e.g. a query about to be
navigated to) will need, ahead of time.
#### Parameters
##### options
`QueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryData`, `TQueryKey`\>
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
#### Example
```ts
const result = await observer.fetchOptimistic({
queryKey: ['posts', 2],
queryFn: () => fetchPost(2),
})
console.log(result.data)
```
***
### getCurrentQuery()
```ts
getCurrentQuery(): Query<TQueryFnData, TError, TQueryData, TQueryKey>;
```
Defined in: [packages/query-core/src/queryObserver.ts:357](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L357)
Returns the `Query` instance this observer is currently observing.
#### Returns
[`Query`](Query.md)\<`TQueryFnData`, `TError`, `TQueryData`, `TQueryKey`\>
***
### getCurrentResult()
```ts
getCurrentResult(): QueryObserverResult<TData, TError>;
```
Defined in: [packages/query-core/src/queryObserver.ts:321](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L321)
Returns the most recently computed `QueryObserverResult` for the
observed query. This is a point-in-time read; to be notified of updates
as they happen, subscribe to the observer instead (its inherited
`subscribe` method).
#### Returns
[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>
#### Example
```ts
const result = observer.getCurrentResult()
console.log(result.status, result.data)
```
***
### getOptimisticResult()
```ts
getOptimisticResult(options): QueryObserverResult<TData, TError>;
```
Defined in: [packages/query-core/src/queryObserver.ts:272](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L272)
Computes the result the observer would produce for the given (already-defaulted) options
right now, building the underlying `Query` if it doesn't exist yet, without waiting for a
subscription callback. Called by framework adapters on every render (e.g. `useQuery`) so the
returned value is available synchronously, ahead of `setOptions` triggering an actual fetch.
#### Parameters
##### options
[`DefaultedQueryObserverOptions`](../type-aliases/DefaultedQueryObserverOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryData`, `TQueryKey`\>
#### Returns
[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>
***
### hasListeners()
```ts
hasListeners(): boolean;
```
Defined in: [packages/query-core/src/subscribable.ts:19](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L19)
#### Returns
`boolean`
#### Inherited from
```ts
Subscribable.hasListeners
```
***
### onSubscribe()
```ts
protected onSubscribe(): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:110](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L110)
#### Returns
`void`
#### Overrides
```ts
Subscribable.onSubscribe
```
***
### onUnsubscribe()
```ts
protected onUnsubscribe(): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:124](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L124)
#### Returns
`void`
#### Overrides
```ts
Subscribable.onUnsubscribe
```
***
### refetch()
```ts
refetch(__namedParameters): Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/queryObserver.ts:371](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L371)
Refetches the observed query and returns a promise that resolves with
the resulting `QueryObserverResult`.
#### Parameters
##### \_\_namedParameters
[`RefetchOptions`](../interfaces/RefetchOptions.md) = `{}`
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
#### Example
```ts
const result = await observer.refetch({ cancelRefetch: false })
console.log(result.data)
```
***
### setOptions()
```ts
setOptions(options): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:182](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L182)
Updates the observer's options. This will re-resolve the query being
observed (switching to a different query if the `queryKey` changed),
trigger a fetch if the new options require one and the observer has
subscribers, recompute the current result, and reschedule the stale and
refetch-interval timers as needed.
#### Parameters
##### options
`QueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryData`, `TQueryKey`\>
#### Returns
`void`
#### Example
```ts
observer.setOptions({ queryKey: ['posts', 1], queryFn: () => fetchPost(1) })
// later: switch to a different query, reusing the same observer
observer.setOptions({ queryKey: ['posts', 2], queryFn: () => fetchPost(2) })
```
***
### shouldFetchOnReconnect()
```ts
shouldFetchOnReconnect(): boolean;
```
Defined in: [packages/query-core/src/queryObserver.ts:135](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L135)
Returns whether the observed query is currently stale and configured
(via the `refetchOnReconnect` option) to refetch when the network
reconnects.
#### Returns
`boolean`
***
### shouldFetchOnWindowFocus()
```ts
shouldFetchOnWindowFocus(): boolean;
```
Defined in: [packages/query-core/src/queryObserver.ts:148](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L148)
Returns whether the observed query is currently stale and configured
(via the `refetchOnWindowFocus` option) to refetch when the window
regains focus.
#### Returns
`boolean`
***
### subscribe()
```ts
subscribe(listener): () => void;
```
Defined in: [packages/query-core/src/subscribable.ts:8](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L8)
#### Parameters
##### listener
`QueryObserverListener`
#### Returns
```ts
(): void;
```
##### Returns
`void`
#### Inherited from
```ts
Subscribable.subscribe
```
***
### trackProp()
```ts
trackProp(key): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:350](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L350)
Records that the given `QueryObserverResult` property was read, so a subsequent update only
notifies this observer if a tracked property actually changed. Normally called indirectly via
[QueryObserver#trackResult](#trackresult)'s proxy; exposed directly for adapters that track property
access themselves (e.g. through their own reactivity system) instead of via the proxy.
#### Parameters
##### key
`"error"` | `"data"` | `"isError"` | `"isPending"` | `"isLoading"` | `"isLoadingError"` | `"isRefetchError"` | `"isSuccess"` | `"isPlaceholderData"` | `"status"` | `"dataUpdatedAt"` | `"errorUpdatedAt"` | `"failureCount"` | `"failureReason"` | `"errorUpdateCount"` | `"isFetched"` | `"isFetchedAfterMount"` | `"isFetching"` | `"isInitialLoading"` | `"isPaused"` | `"isRefetching"` | `"isStale"` | `"isEnabled"` | `"refetch"` | `"fetchStatus"`
#### Returns
`void`
***
### trackResult()
```ts
trackResult(result, onPropTracked?): QueryObserverResult<TData, TError>;
```
Defined in: [packages/query-core/src/queryObserver.ts:331](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L331)
Wraps a `QueryObserverResult` in a `Proxy` that records which properties are read, via
[QueryObserver#trackProp](#trackprop) (and an optional `onPropTracked` callback). Used by framework
adapters when `notifyOnChangeProps` is not set, to implement its default "only re-render on
properties you actually read" behavior.
#### Parameters
##### result
[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>
##### onPropTracked?
(`key`) => `void`
#### Returns
[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>
***
### updateResult()
```ts
updateResult(): void;
```
Defined in: [packages/query-core/src/queryObserver.ts:735](https://github.com/TanStack/query/blob/main/packages/query-core/src/queryObserver.ts#L735)
Recomputes and stores the current result from the current query/options, notifying listeners
if it changed. Framework adapters call this right after subscribing to make sure no query
update was missed in the gap between creating the observer and subscribing to it.
#### Returns
`void`

View File

@@ -0,0 +1,39 @@
---
id: QueryClientProvider
title: QueryClientProvider
---
```ts
function QueryClientProvider(props): Element;
```
Defined in: [packages/solid-query/src/QueryClientProvider.tsx:95](https://github.com/TanStack/query/blob/main/packages/solid-query/src/QueryClientProvider.tsx#L95)
Use the `QueryClientProvider` component to connect and provide a `QueryClient` to your application. Also
calls `client.mount()`/`client.unmount()` as this component mounts/unmounts, which subscribes the client to
focus/online events (resuming any paused mutations and refetching as needed when the app regains focus or
comes back online).
## Parameters
### props
[`QueryClientProviderProps`](../type-aliases/QueryClientProviderProps.md)
## Returns
`Element`
The provided `children`, wrapped so they can read the `QueryClient` via `useQueryClient`.
## Example
```tsx
import { QueryClient, QueryClientProvider } from '@tanstack/solid-query'
const queryClient = new QueryClient()
function App() {
return <QueryClientProvider client={queryClient}>...</QueryClientProvider>
}
```

View File

@@ -0,0 +1,23 @@
---
id: defaultShouldDehydrateMutation
title: defaultShouldDehydrateMutation
---
```ts
function defaultShouldDehydrateMutation(mutation): boolean;
```
Defined in: [packages/query-core/src/hydration.ts:177](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L177)
The default `shouldDehydrateMutation` predicate used by `dehydrate`. Only dehydrates mutations that are
currently paused (e.g. paused by `networkMode` while offline).
## Parameters
### mutation
[`Mutation`](../classes/Mutation.md)
## Returns
`boolean`

View File

@@ -0,0 +1,23 @@
---
id: defaultShouldDehydrateQuery
title: defaultShouldDehydrateQuery
---
```ts
function defaultShouldDehydrateQuery(query): boolean;
```
Defined in: [packages/query-core/src/hydration.ts:185](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L185)
The default `shouldDehydrateQuery` predicate used by `dehydrate`. Only dehydrates queries whose status is
`'success'`.
## Parameters
### query
[`Query`](../classes/Query.md)
## Returns
`boolean`

View File

@@ -0,0 +1,43 @@
---
id: dehydrate
title: dehydrate
---
```ts
function dehydrate(client, options): DehydratedState;
```
Defined in: [packages/query-core/src/hydration.ts:207](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L207)
Dehydrates a `QueryClient`'s cache (queries and mutations) into a plain, serializable `DehydratedState`,
typically to embed in server-rendered markup and later restore into a client-side `QueryClient` via `hydrate`.
Which queries/mutations are included, and how their data/errors are transformed, is controlled by `options`,
falling back to the client's `dehydrate` default options, and finally to `defaultShouldDehydrateQuery` /
`defaultShouldDehydrateMutation`.
## Parameters
### client
`QueryClient`
### options
[`DehydrateOptions`](../interfaces/DehydrateOptions.md) = `{}`
## Returns
[`DehydratedState`](../interfaces/DehydratedState.md)
## Example
```ts
const queryClient = new QueryClient()
await queryClient.prefetchQuery({
queryKey: ['posts'],
queryFn: getPosts,
})
const dehydratedState = dehydrate(queryClient)
```

View File

@@ -0,0 +1,43 @@
---
id: dehydrateQuery
title: dehydrateQuery
---
```ts
function dehydrateQuery(
query,
serializeData?,
shouldRedactErrors?): DehydratedQuery;
```
Defined in: [packages/query-core/src/hydration.ts:148](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L148)
Dehydrates a single `Query` into a serializable `DehydratedQuery` snapshot. Note that most query config (e.g.
`queryFn`, `staleTime`) is not dehydrated but instead meant to be configured again when consuming the
de/rehydrated data, typically with `useQuery` on the client. If the query is still `pending`, its in-flight
promise is dehydrated too so it can be resumed on the other side instead of re-fetched.
## Parameters
### query
[`Query`](../classes/Query.md)
The query to dehydrate.
### serializeData?
`TransformerFn`
Optional transform applied to `query.state.data` before it is included in the snapshot.
### shouldRedactErrors?
(`error`) => `boolean`
Optional predicate; if it returns `false` for the promise's rejection error, that
error is kept as-is instead of being redacted.
## Returns
`DehydratedQuery`

View File

@@ -0,0 +1,52 @@
---
id: experimental_streamedQuery
title: experimental_streamedQuery
---
```ts
function experimental_streamedQuery<TQueryFnData, TData, TQueryKey>(streamFn): QueryFunction<TData, TQueryKey>;
```
Defined in: [packages/query-core/src/streamedQuery.ts:75](https://github.com/TanStack/query/blob/main/packages/query-core/src/streamedQuery.ts#L75)
This is a helper function to create a query function that streams data from an AsyncIterable.
Data will be an Array of all the chunks received.
The query will be in a 'pending' state until the first chunk of data is received, but will go to 'success' after that.
The query will stay in fetchStatus 'fetching' until the stream ends.
## Type Parameters
### TQueryFnData
`TQueryFnData` = `unknown`
### TData
`TData` = `TQueryFnData`[]
### TQueryKey
`TQueryKey` *extends* readonly `unknown`[] = readonly `unknown`[]
## Parameters
### streamFn
`StreamedQueryParams`\<`TQueryFnData`, `TData`, `TQueryKey`\>
The function that returns an AsyncIterable to stream data from.
## Returns
[`QueryFunction`](../type-aliases/QueryFunction.md)\<`TData`, `TQueryKey`\>
## Example
```ts
await queryClient.query({
queryKey: ['data'],
queryFn: streamedQuery({
streamFn: fetchDataInChunks,
}),
})
```

View File

@@ -0,0 +1,30 @@
---
id: hashKey
title: hashKey
---
```ts
function hashKey(queryKey): string;
```
Defined in: [packages/query-core/src/utils.ts:284](https://github.com/TanStack/query/blob/main/packages/query-core/src/utils.ts#L284)
Default query & mutation keys hash function.
Hashes the value into a stable hash.
## Parameters
### queryKey
readonly `unknown`[]
## Returns
`string`
## Example
```ts
// Object keys are sorted, so key order doesn't affect the hash:
hashKey(['todos', { page: 1, filter: 'done' }]) // === '["todos",{"filter":"done","page":1}]'
```

View File

@@ -0,0 +1,49 @@
---
id: hydrate
title: hydrate
---
```ts
function hydrate(
client,
dehydratedState,
options?): void;
```
Defined in: [packages/query-core/src/hydration.ts:264](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L264)
Restores a `DehydratedState` (as produced by `dehydrate`) into a `QueryClient`'s cache, typically to seed the
client with data already fetched on the server. `mutations` and `queries` are each optional on `dehydratedState`.
Queries not yet in the cache are built from the dehydrated snapshot; queries that already exist are only updated
when the dehydrated data is newer than what's already cached. Newly built queries have their `fetchStatus` reset
to `'idle'` so they don't hydrate stuck in a fetching state. If a dehydrated query still had an in-flight
promise, it is resumed via `query.fetch()` (reusing that promise as `initialPromise`) rather than re-invoking
`queryFn`.
## Parameters
### client
`QueryClient`
### dehydratedState
`Partial`\<[`DehydratedState`](../interfaces/DehydratedState.md)\>
### options?
[`HydrateOptions`](../interfaces/HydrateOptions.md)
## Returns
`void`
## Example
```ts
// dehydratedState was produced by `dehydrate` on the server
// and sent to the client, e.g. embedded in server-rendered markup.
const queryClient = new QueryClient()
hydrate(queryClient, dehydratedState)
```

View File

@@ -0,0 +1,178 @@
---
id: infiniteQueryOptions
title: infiniteQueryOptions
redirect_from:
- framework/solid/reference/infiniteQueryOptions
---
## Call Signature
```ts
function infiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>(options): InfiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & object & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData, unknown>, TError>;
```
Defined in: [packages/solid-query/src/infiniteQueryOptions.ts:105](https://github.com/TanStack/query/blob/main/packages/solid-query/src/infiniteQueryOptions.ts#L105)
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.
### Type Parameters
#### TQueryFnData
`TQueryFnData`
#### TError
`TError` = `Error`
#### TData
`TData` = [`InfiniteData`](../interfaces/InfiniteData.md)\<`TQueryFnData`, `unknown`\>
#### TQueryKey
`TQueryKey` *extends* readonly `unknown`[] = readonly `unknown`[]
#### TPageParam
`TPageParam` = `unknown`
### Parameters
#### options
[`InfiniteQueryOptions`](../interfaces/InfiniteQueryOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\> & `object`
The [DefinedInitialDataInfiniteOptions](../type-aliases/DefinedInitialDataInfiniteOptions.md) to use — everything you can pass to `useInfiniteQuery`, with `initialData` set.
### Returns
[`InfiniteQueryOptions`](../interfaces/InfiniteQueryOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\> & `object` & [`QueryKeyWithDataTag`](../type-aliases/QueryKeyWithDataTag.md)\<`TQueryKey`, [`InfiniteData`](../interfaces/InfiniteData.md)\<`TQueryFnData`, `unknown`\>, `TError`\>
The same options object, typed so that `queryKey` carries the inferred data type.
### See
[useInfiniteQuery](useInfiniteQuery.md) to run an infinite query with these options.
### Example
```tsx
import { For } from 'solid-js'
import { infiniteQueryOptions, useInfiniteQuery } from '@tanstack/solid-query'
const projectsOptions = infiniteQueryOptions({
queryKey: ['projects'],
queryFn: ({ pageParam }) => fetchProjects(pageParam),
initialPageParam: 0,
getNextPageParam: (lastPage) => lastPage.nextId,
initialData: { pages: [], pageParams: [] },
})
function Projects() {
// `projectsQuery.data` is never `undefined`, thanks to `initialData` — even if a refetch fails, so the
// list stays visible alongside the error.
const projectsQuery = useInfiniteQuery(() => projectsOptions)
return (
<div>
{projectsQuery.isError ? <span>Error: {projectsQuery.error.message}</span> : null}
<ul>
<For each={projectsQuery.data.pages}>
{(page) => <For each={page.projects}>{(p) => <li>{p.name}</li>}</For>}
</For>
</ul>
</div>
)
}
```
## Call Signature
```ts
function infiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>(options): InfiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & object & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData, unknown>, TError>;
```
Defined in: [packages/solid-query/src/infiniteQueryOptions.ts:174](https://github.com/TanStack/query/blob/main/packages/solid-query/src/infiniteQueryOptions.ts#L174)
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`](../interfaces/InfiniteData.md)\<`TQueryFnData`, `unknown`\>
#### TQueryKey
`TQueryKey` *extends* readonly `unknown`[] = readonly `unknown`[]
#### TPageParam
`TPageParam` = `unknown`
### Parameters
#### options
[`InfiniteQueryOptions`](../interfaces/InfiniteQueryOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\> & `object`
The [UndefinedInitialDataInfiniteOptions](../type-aliases/UndefinedInitialDataInfiniteOptions.md) to use — everything you can pass to `useInfiniteQuery`.
### Returns
[`InfiniteQueryOptions`](../interfaces/InfiniteQueryOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\> & `object` & [`QueryKeyWithDataTag`](../type-aliases/QueryKeyWithDataTag.md)\<`TQueryKey`, [`InfiniteData`](../interfaces/InfiniteData.md)\<`TQueryFnData`, `unknown`\>, `TError`\>
The same options object, typed so that `queryKey` carries the inferred data type.
### See
[useInfiniteQuery](useInfiniteQuery.md) to run an infinite query with these options.
### Example
A parameterized factory, so the same options object can be reused per `postId`:
```tsx
import { For, Match, Switch } from 'solid-js'
import { infiniteQueryOptions, useInfiniteQuery } from '@tanstack/solid-query'
const commentsOptions = (postId: string) =>
infiniteQueryOptions({
queryKey: ['post', postId, 'comments'],
queryFn: ({ pageParam }) => fetchComments(postId, pageParam),
initialPageParam: 0,
getNextPageParam: (lastPage) => lastPage.nextId,
})
function Comments(props: { postId: string }) {
const commentsQuery = useInfiniteQuery(() => commentsOptions(props.postId))
return (
<Switch>
<Match when={commentsQuery.isPending}>Loading...</Match>
<Match when={commentsQuery.isError}>Error: {commentsQuery.error.message}</Match>
<Match when={commentsQuery.isSuccess}>
<ul>
<For each={commentsQuery.data.pages}>
{(page) => <For each={page.comments}>{(c) => <li>{c.text}</li>}</For>}
</For>
</ul>
</Match>
</Switch>
)
}
```

View File

@@ -0,0 +1,24 @@
---
id: isCancelledError
title: isCancelledError
---
```ts
function isCancelledError(value): value is CancelledError;
```
Defined in: [packages/query-core/src/retryer.ts:90](https://github.com/TanStack/query/blob/main/packages/query-core/src/retryer.ts#L90)
## Parameters
### value
`any`
## Returns
`value is CancelledError`
## Deprecated
Use instanceof `CancelledError` instead.

View File

@@ -0,0 +1,40 @@
---
id: keepPreviousData
title: keepPreviousData
---
```ts
function keepPreviousData<T>(previousData): T | undefined;
```
Defined in: [packages/query-core/src/utils.ts:493](https://github.com/TanStack/query/blob/main/packages/query-core/src/utils.ts#L493)
Intended to be passed as a query's `placeholderData` option, for example
`placeholderData: keepPreviousData`. Instead of resetting the query's data to `undefined` while a new
query key is fetching, it keeps displaying the previously fetched data until the new data arrives.
## Type Parameters
### T
`T`
## Parameters
### previousData
`T` | `undefined`
## Returns
`T` \| `undefined`
## Example
```ts
new QueryObserver(queryClient, {
queryKey: ['posts', page],
queryFn: () => fetchPosts(page),
placeholderData: keepPreviousData,
})
```

View File

@@ -0,0 +1,38 @@
---
id: matchMutation
title: matchMutation
---
```ts
function matchMutation(filters, mutation): boolean;
```
Defined in: [packages/query-core/src/utils.ts:237](https://github.com/TanStack/query/blob/main/packages/query-core/src/utils.ts#L237)
Checks whether a mutation matches the given [MutationFilters](../interfaces/MutationFilters.md).
Every filter that is specified must match; filters that are left unspecified are ignored.
If a `mutationKey` filter is provided but the mutation has no `mutationKey` of its own, it does not match.
## Parameters
### filters
[`MutationFilters`](../interfaces/MutationFilters.md)
### mutation
[`Mutation`](../classes/Mutation.md)\<`any`, `any`\>
## Returns
`boolean`
## Example
```ts
const mutationCache = queryClient.getMutationCache()
const matchingMutations = mutationCache
.getAll()
.filter((mutation) => matchMutation({ mutationKey: ['addPost'] }, mutation))
```

View File

@@ -0,0 +1,37 @@
---
id: matchQuery
title: matchQuery
---
```ts
function matchQuery(filters, query): boolean;
```
Defined in: [packages/query-core/src/utils.ts:175](https://github.com/TanStack/query/blob/main/packages/query-core/src/utils.ts#L175)
Checks whether a query matches the given [QueryFilters](../interfaces/QueryFilters.md).
Every filter that is specified must match; filters that are left unspecified are ignored.
## Parameters
### filters
[`QueryFilters`](../interfaces/QueryFilters.md)
### query
[`Query`](../classes/Query.md)\<`any`, `any`, `any`, `any`\>
## Returns
`boolean`
## Example
```ts
const queryCache = queryClient.getQueryCache()
const matchingQueries = queryCache
.getAll()
.filter((query) => matchQuery({ queryKey: ['posts'] }, query))
```

View File

@@ -0,0 +1,144 @@
---
id: mutationOptions
title: mutationOptions
redirect_from:
- framework/solid/reference/mutationOptions
---
## Call Signature
```ts
function mutationOptions<TData, TError, TVariables, TOnMutateResult>(options): WithRequired<MutationOptions<TData, TError, TVariables, TOnMutateResult>, "mutationKey">;
```
Defined in: [packages/solid-query/src/mutationOptions.ts:33](https://github.com/TanStack/query/blob/main/packages/solid-query/src/mutationOptions.ts#L33)
You can generally pass everything to `mutationOptions` that you can also pass to `useMutation`. A
`mutationKey` is required on this overload so the mutation can be looked up later, e.g. with
`useMutationState`.
### Type Parameters
#### TData
`TData` = `unknown`
#### TError
`TError` = `Error`
#### TVariables
`TVariables` = `void`
#### TOnMutateResult
`TOnMutateResult` = `unknown`
### Parameters
#### options
[`WithRequired`](../type-aliases/WithRequired.md)\<[`MutationOptions`](../interfaces/MutationOptions.md)\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>, `"mutationKey"`\>
The mutation options to use, identical to what you'd pass to `useMutation`, with a
required `mutationKey`.
### Returns
[`WithRequired`](../type-aliases/WithRequired.md)\<[`MutationOptions`](../interfaces/MutationOptions.md)\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>, `"mutationKey"`\>
The same options object, unchanged.
### See
[useMutation](useMutation.md) to run the mutation these options describe.
### Example
Looking the mutation up elsewhere via its `mutationKey`, e.g. for a global "saving…" indicator:
```tsx
import { mutationOptions, useMutationState } from '@tanstack/solid-query'
const createPostOptions = mutationOptions({
mutationKey: ['posts', 'create'],
mutationFn: createPost,
})
function SavingIndicator() {
const isCreatingPost = useMutationState(() => ({
filters: { mutationKey: createPostOptions.mutationKey, status: 'pending' },
}))
return isCreatingPost().length > 0 ? <span>Saving…</span> : null
}
```
## Call Signature
```ts
function mutationOptions<TData, TError, TVariables, TOnMutateResult>(options): Omit<MutationOptions<TData, TError, TVariables, TOnMutateResult>, "mutationKey">;
```
Defined in: [packages/solid-query/src/mutationOptions.ts:73](https://github.com/TanStack/query/blob/main/packages/solid-query/src/mutationOptions.ts#L73)
You can generally pass everything to `mutationOptions` that you can also pass to `useMutation`. No
`mutationKey` is required on this overload — use this when you don't need to target the mutation via a
`mutationKey` filter later (e.g. with `useMutationState`); it can still be observed through other filters,
such as `status`.
### Type Parameters
#### TData
`TData` = `unknown`
#### TError
`TError` = `Error`
#### TVariables
`TVariables` = `void`
#### TOnMutateResult
`TOnMutateResult` = `unknown`
### Parameters
#### options
`Omit`\<[`MutationOptions`](../interfaces/MutationOptions.md)\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>, `"mutationKey"`\>
The mutation options to use, identical to what you'd pass to `useMutation`, without a
`mutationKey`.
### Returns
`Omit`\<[`MutationOptions`](../interfaces/MutationOptions.md)\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>, `"mutationKey"`\>
The same options object, unchanged.
### See
[useMutation](useMutation.md) to run the mutation these options describe.
### Remarks
See the other overload's example for looking a mutation up via `useMutationState`.
### Example
```tsx
import { mutationOptions, useMutation } from '@tanstack/solid-query'
const createPostOptions = mutationOptions({
mutationFn: createPost,
})
function CreatePost() {
const createPostMutation = useMutation(() => createPostOptions)
return <button onClick={() => createPostMutation.mutate({ title: 'Hello' })}>Create</button>
}
```

View File

@@ -0,0 +1,32 @@
---
id: noop
title: noop
---
## Call Signature
```ts
function noop(): void;
```
Defined in: [packages/query-core/src/utils.ts:119](https://github.com/TanStack/query/blob/main/packages/query-core/src/utils.ts#L119)
A function that does nothing.
### Returns
`void`
## Call Signature
```ts
function noop(): undefined;
```
Defined in: [packages/query-core/src/utils.ts:120](https://github.com/TanStack/query/blob/main/packages/query-core/src/utils.ts#L120)
A function that does nothing.
### Returns
`undefined`

View File

@@ -0,0 +1,26 @@
---
id: partialMatchKey
title: partialMatchKey
---
```ts
function partialMatchKey(a, b): boolean;
```
Defined in: [packages/query-core/src/utils.ts:300](https://github.com/TanStack/query/blob/main/packages/query-core/src/utils.ts#L300)
Checks if key `b` partially matches with key `a`.
## Parameters
### a
readonly `unknown`[]
### b
readonly `unknown`[]
## Returns
`boolean`

View File

@@ -0,0 +1,160 @@
---
id: queryOptions
title: queryOptions
redirect_from:
- framework/solid/reference/queryOptions
---
## Call Signature
```ts
function queryOptions<TQueryFnData, TError, TData, TQueryKey>(options): QueryOptions<TQueryFnData, TError, TData, TQueryKey> & object & QueryKeyWithDataTag<TQueryKey, TQueryFnData, TError>;
```
Defined in: [packages/solid-query/src/queryOptions.ts:89](https://github.com/TanStack/query/blob/main/packages/solid-query/src/queryOptions.ts#L89)
You can generally pass everything to `queryOptions` that you can also pass to `useQuery`. These options can
be shared across hooks and imperative APIs such as `queryClient.query`. `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` = `unknown`
#### TError
`TError` = `Error`
#### TData
`TData` = `TQueryFnData`
#### TQueryKey
`TQueryKey` *extends* readonly `unknown`[] = readonly `unknown`[]
### Parameters
#### options
[`QueryOptions`](../interfaces/QueryOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\> & `object`
The [DefinedInitialDataOptions](../type-aliases/DefinedInitialDataOptions.md) to use — everything you can pass to `useQuery`, with `initialData` set.
### Returns
[`QueryOptions`](../interfaces/QueryOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\> & `object` & [`QueryKeyWithDataTag`](../type-aliases/QueryKeyWithDataTag.md)\<`TQueryKey`, `TQueryFnData`, `TError`\>
The same options object, typed so that `queryKey` carries the inferred data type.
### See
[useQuery](useQuery.md) to run a query with these options.
### Example
```tsx
import { For } from 'solid-js'
import { queryOptions, useQuery } from '@tanstack/solid-query'
const postsOptions = queryOptions({
queryKey: ['posts'],
queryFn: fetchPosts,
initialData: [],
})
function Posts() {
// `postsQuery.data` is `Post[]`, never `undefined`, thanks to `initialData` — even if a refetch fails,
// so the list stays visible alongside the error.
const postsQuery = useQuery(() => postsOptions)
return (
<div>
{postsQuery.isError ? <span>Error: {postsQuery.error.message}</span> : null}
<ul>
<For each={postsQuery.data}>{(post) => <li>{post.title}</li>}</For>
</ul>
</div>
)
}
```
## Call Signature
```ts
function queryOptions<TQueryFnData, TError, TData, TQueryKey>(options): QueryOptions<TQueryFnData, TError, TData, TQueryKey> & object & QueryKeyWithDataTag<TQueryKey, TQueryFnData, TError>;
```
Defined in: [packages/solid-query/src/queryOptions.ts:139](https://github.com/TanStack/query/blob/main/packages/solid-query/src/queryOptions.ts#L139)
You can generally pass everything to `queryOptions` that you can also pass to `useQuery`. These options can
be shared across hooks and imperative APIs such as `queryClient.query`. `options.queryKey` is required and
is the query key to generate options for.
### Type Parameters
#### TQueryFnData
`TQueryFnData` = `unknown`
#### TError
`TError` = `Error`
#### TData
`TData` = `TQueryFnData`
#### TQueryKey
`TQueryKey` *extends* readonly `unknown`[] = readonly `unknown`[]
### Parameters
#### options
[`QueryOptions`](../interfaces/QueryOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\> & `object`
The [UndefinedInitialDataOptions](../type-aliases/UndefinedInitialDataOptions.md) to use — everything you can pass to `useQuery`.
### Returns
[`QueryOptions`](../interfaces/QueryOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\> & `object` & [`QueryKeyWithDataTag`](../type-aliases/QueryKeyWithDataTag.md)\<`TQueryKey`, `TQueryFnData`, `TError`\>
The same options object, typed so that `queryKey` carries the inferred data type.
### See
[useQuery](useQuery.md) to run a query with these options.
### Example
A parameterized factory, so the same options object can be reused per `id`:
```tsx
import { Match, Switch } from 'solid-js'
import { queryOptions, useQuery } from '@tanstack/solid-query'
const postOptions = (id: string) =>
queryOptions({
queryKey: ['post', id],
queryFn: () => fetchPost(id),
})
function Post(props: { id: string }) {
const postQuery = useQuery(() => postOptions(props.id))
return (
<Switch>
<Match when={postQuery.isPending}>Loading...</Match>
<Match when={postQuery.isError}>Error: {postQuery.error.message}</Match>
<Match when={postQuery.isSuccess}>
<h1>{postQuery.data.title}</h1>
</Match>
</Switch>
)
}
```

View File

@@ -0,0 +1,41 @@
---
id: replaceEqualDeep
title: replaceEqualDeep
---
```ts
function replaceEqualDeep<T>(
a,
b,
depth?): T;
```
Defined in: [packages/query-core/src/utils.ts:339](https://github.com/TanStack/query/blob/main/packages/query-core/src/utils.ts#L339)
This function returns `a` if `b` is deeply equal.
If not, it will replace any deeply equal children of `b` with those of `a`.
This can be used for structural sharing between JSON values for example.
## Type Parameters
### T
`T`
## Parameters
### a
`unknown`
### b
`T`
### depth?
`number`
## Returns
`T`

View File

@@ -0,0 +1,45 @@
---
id: shouldThrowError
title: shouldThrowError
---
```ts
function shouldThrowError<T>(throwOnError, params): boolean;
```
Defined in: [packages/query-core/src/utils.ts:576](https://github.com/TanStack/query/blob/main/packages/query-core/src/utils.ts#L576)
Resolves a `throwOnError` option to a boolean.
If `throwOnError` is a function, it is called with `params` (e.g. the error and, depending on the caller,
additional context such as the query or mutation) and its result is returned, allowing the throwing
behavior to be decided per error. Otherwise, `throwOnError` itself is coerced to a boolean (`undefined`
resolves to `false`).
## Type Parameters
### T
`T` *extends* (...`args`) => `boolean`
## Parameters
### throwOnError
`boolean` | `T` | `undefined`
### params
`Parameters`\<`T`\>
## Returns
`boolean`
## Example
```ts
const throwOnError =
query.state.error && typeof options.throwOnError === 'function'
? shouldThrowError(options.throwOnError, [query.state.error, query])
: options.throwOnError
```

View File

@@ -0,0 +1,259 @@
---
id: useInfiniteQuery
title: useInfiniteQuery
redirect_from:
- framework/solid/reference/useInfiniteQuery
---
## Call Signature
```ts
function useInfiniteQuery<TQueryFnData, TError, TData, TQueryKey, TPageParam>(options, queryClient?): DefinedUseInfiniteQueryResult<TData, TError>;
```
Defined in: [packages/solid-query/src/useInfiniteQuery.ts:70](https://github.com/TanStack/query/blob/main/packages/solid-query/src/useInfiniteQuery.ts#L70)
The options for `useInfiniteQuery` are identical to `useQuery`, with the addition of
`initialPageParam`, `getNextPageParam`, `getPreviousPageParam`, and `maxPages`.
This overload is selected when `initialData` is set.
### Type Parameters
#### TQueryFnData
`TQueryFnData`
#### TError
`TError` = `Error`
#### TData
`TData` = [`InfiniteData`](../interfaces/InfiniteData.md)\<`TQueryFnData`, `unknown`\>
#### TQueryKey
`TQueryKey` *extends* readonly `unknown`[] = readonly `unknown`[]
#### TPageParam
`TPageParam` = `unknown`
### Parameters
#### options
[`DefinedInitialDataInfiniteOptions`](../type-aliases/DefinedInitialDataInfiniteOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>
An accessor returning the [DefinedInitialDataInfiniteOptions](../type-aliases/DefinedInitialDataInfiniteOptions.md) to use — everything you
can pass to `useInfiniteQuery`, with `initialData` set.
#### queryClient?
`Accessor`\<[`QueryClient`](../classes/QueryClient.md)\>
An accessor for a custom `QueryClient`. Otherwise, the one from the nearest context
will be used.
### Returns
[`DefinedUseInfiniteQueryResult`](../type-aliases/DefinedUseInfiniteQueryResult.md)\<`TData`, `TError`\>
The same properties as `useQuery`, with the addition of `fetchNextPage`, `fetchPreviousPage`,
`hasNextPage`, `hasPreviousPage`, `isFetchingNextPage`, and `isFetchingPreviousPage`. `data.pages` and
`data.pageParams` are also added, as long as a `select` doesn't change `TData` away from its default
`InfiniteData<TQueryFnData>` shape.
### Remarks
Keep in mind that imperative fetch calls, such as `fetchNextPage`, may interfere with the default
refetch behavior, resulting in outdated data. Make sure to call these functions only in response to user
actions, or add conditions like `hasNextPage && !isFetching`.
### See
[infiniteQueryOptions](infiniteQueryOptions.md) to share these options between `useInfiniteQuery` and imperative APIs like `queryClient.infiniteQuery`.
### Example
```tsx
import { For } from 'solid-js'
import { useInfiniteQuery } from '@tanstack/solid-query'
function Projects() {
// `projectsQuery.data` is never `undefined`, thanks to `initialData` — even if a refetch fails, so the
// list stays visible alongside the error.
const projectsQuery = useInfiniteQuery(() => ({
queryKey: ['projects'],
queryFn: ({ pageParam }) => fetchProjects(pageParam),
initialPageParam: 0,
getNextPageParam: (lastPage) => lastPage.nextId,
initialData: { pages: [], pageParams: [] },
}))
return (
<div>
{projectsQuery.isError ? <span>Error: {projectsQuery.error.message}</span> : null}
<ul>
<For each={projectsQuery.data.pages}>
{(page) => <For each={page.projects}>{(p) => <li>{p.name}</li>}</For>}
</For>
</ul>
</div>
)
}
```
## Call Signature
```ts
function useInfiniteQuery<TQueryFnData, TError, TData, TQueryKey, TPageParam>(options, queryClient?): UseInfiniteQueryResult<TData, TError>;
```
Defined in: [packages/solid-query/src/useInfiniteQuery.ts:189](https://github.com/TanStack/query/blob/main/packages/solid-query/src/useInfiniteQuery.ts#L189)
The options for `useInfiniteQuery` are identical to `useQuery`, with the addition of
`initialPageParam`, `getNextPageParam`, `getPreviousPageParam`, and `maxPages`.
### Type Parameters
#### TQueryFnData
`TQueryFnData`
#### TError
`TError` = `Error`
#### TData
`TData` = [`InfiniteData`](../interfaces/InfiniteData.md)\<`TQueryFnData`, `unknown`\>
#### TQueryKey
`TQueryKey` *extends* readonly `unknown`[] = readonly `unknown`[]
#### TPageParam
`TPageParam` = `unknown`
### Parameters
#### options
[`UndefinedInitialDataInfiniteOptions`](../type-aliases/UndefinedInitialDataInfiniteOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>
An accessor returning the [UndefinedInitialDataInfiniteOptions](../type-aliases/UndefinedInitialDataInfiniteOptions.md) to use — everything
you can pass to `useInfiniteQuery`.
#### queryClient?
`Accessor`\<[`QueryClient`](../classes/QueryClient.md)\>
An accessor for a custom `QueryClient`. Otherwise, the one from the nearest context
will be used.
### Returns
[`UseInfiniteQueryResult`](../type-aliases/UseInfiniteQueryResult.md)\<`TData`, `TError`\>
The same properties as `useQuery`, with the addition of `fetchNextPage`, `fetchPreviousPage`,
`hasNextPage`, `hasPreviousPage`, `isFetchingNextPage`, and `isFetchingPreviousPage`. `data.pages` and
`data.pageParams` are also added, as long as a `select` doesn't change `TData` away from its default
`InfiniteData<TQueryFnData>` shape.
### Remarks
Keep in mind that imperative fetch calls, such as `fetchNextPage`, may interfere with the default
refetch behavior, resulting in outdated data. Make sure to call these functions only in response to user
actions, or add conditions like `hasNextPage && !isFetching`.
### See
[infiniteQueryOptions](infiniteQueryOptions.md) to share these options between `useInfiniteQuery` and imperative APIs like `queryClient.infiniteQuery`.
### Examples
Fetching the next page from a "Load More" button click:
```tsx
import { For, Match, Switch } from 'solid-js'
import { useInfiniteQuery } from '@tanstack/solid-query'
function Projects() {
const projectsQuery = useInfiniteQuery(() => ({
queryKey: ['projects'],
queryFn: ({ pageParam }) => fetchProjects(pageParam),
initialPageParam: 0,
getNextPageParam: (lastPage) => lastPage.nextId,
}))
return (
<Switch>
<Match when={projectsQuery.isPending}>Loading...</Match>
<Match when={projectsQuery.isError}>Error: {projectsQuery.error.message}</Match>
<Match when={projectsQuery.isSuccess}>
<ul>
<For each={projectsQuery.data.pages}>
{(page) => <For each={page.projects}>{(p) => <li>{p.name}</li>}</For>}
</For>
</ul>
<button
onClick={() => projectsQuery.fetchNextPage()}
disabled={!projectsQuery.hasNextPage || projectsQuery.isFetching}
>
{projectsQuery.isFetchingNextPage
? 'Loading more...'
: projectsQuery.hasNextPage
? 'Load More'
: 'Nothing more to load'}
</button>
</Match>
</Switch>
)
}
```
Fetching the next page automatically as the user scrolls, using an `IntersectionObserver` on a
sentinel element after the list:
```tsx
import { For, Match, Switch, createEffect, onCleanup } from 'solid-js'
import { useInfiniteQuery } from '@tanstack/solid-query'
function Projects() {
const projectsQuery = useInfiniteQuery(() => ({
queryKey: ['projects'],
queryFn: ({ pageParam }) => fetchProjects(pageParam),
initialPageParam: 0,
getNextPageParam: (lastPage) => lastPage.nextId,
}))
let sentinelRef: HTMLDivElement | undefined
createEffect(() => {
if (sentinelRef == null || !projectsQuery.hasNextPage || projectsQuery.isFetching) return
const observer = new IntersectionObserver(([entry]) => {
if (entry?.isIntersecting) projectsQuery.fetchNextPage()
})
observer.observe(sentinelRef)
onCleanup(() => observer.disconnect())
})
return (
<Switch>
<Match when={projectsQuery.isPending}>Loading...</Match>
<Match when={projectsQuery.isError}>Error: {projectsQuery.error.message}</Match>
<Match when={projectsQuery.isSuccess}>
<ul>
<For each={projectsQuery.data.pages}>
{(page) => <For each={page.projects}>{(p) => <li>{p.name}</li>}</For>}
</For>
</ul>
<div ref={sentinelRef}>{projectsQuery.isFetchingNextPage ? 'Loading more...' : null}</div>
</Match>
</Switch>
)
}
```

View File

@@ -0,0 +1,50 @@
---
id: useIsFetching
title: useIsFetching
redirect_from:
- framework/solid/reference/useIsFetching
---
```ts
function useIsFetching(filters?, queryClient?): Accessor<number>;
```
Defined in: [packages/solid-query/src/useIsFetching.ts:29](https://github.com/TanStack/query/blob/main/packages/solid-query/src/useIsFetching.ts#L29)
The `useIsFetching` hook returns the `number` of the queries that your application is loading or fetching
in the background (useful for app-wide loading indicators).
## Parameters
### filters?
`Accessor`\<[`QueryFilters`](../interfaces/QueryFilters.md)\<readonly `unknown`[]\>\>
An accessor returning the [QueryFilters](../interfaces/QueryFilters.md) to narrow down the matched queries.
### queryClient?
`Accessor`\<[`QueryClient`](../classes/QueryClient.md)\>
An accessor for a custom `QueryClient`. Otherwise, the one from the nearest context
will be used.
## Returns
`Accessor`\<`number`\>
An accessor for the `number` of the queries that your application is currently loading or fetching
in the background.
## Example
```tsx
import { useIsFetching } from '@tanstack/solid-query'
function GlobalLoadingIndicator() {
// How many queries matching the posts prefix are fetching?
const isFetchingPosts = useIsFetching(() => ({ queryKey: ['posts'] }))
return isFetchingPosts() > 0 ? <span>Loading posts...</span> : null
}
```

View File

@@ -0,0 +1,49 @@
---
id: useIsMutating
title: useIsMutating
redirect_from:
- framework/solid/reference/useIsMutating
---
```ts
function useIsMutating(filters?, queryClient?): Accessor<number>;
```
Defined in: [packages/solid-query/src/useIsMutating.ts:28](https://github.com/TanStack/query/blob/main/packages/solid-query/src/useIsMutating.ts#L28)
The `useIsMutating` hook returns the `number` of mutations that your application currently has `pending`
(useful for app-wide loading indicators).
## Parameters
### filters?
`Accessor`\<[`MutationFilters`](../interfaces/MutationFilters.md)\<`unknown`, `Error`, `unknown`, `unknown`\>\>
An accessor returning the [MutationFilters](../interfaces/MutationFilters.md) to narrow down the matched mutations.
### queryClient?
`Accessor`\<[`QueryClient`](../classes/QueryClient.md)\>
An accessor for a custom `QueryClient`. Otherwise, the one from the nearest context
will be used.
## Returns
`Accessor`\<`number`\>
An accessor for the `number` of the mutations that your application currently has `pending`.
## Example
```tsx
import { useIsMutating } from '@tanstack/solid-query'
function PostsMutatingIndicator() {
// How many mutations matching the posts prefix are in progress?
const isMutatingPosts = useIsMutating(() => ({ mutationKey: ['posts'] }))
return isMutatingPosts() > 0 ? <span>Saving posts...</span> : null
}
```

View File

@@ -0,0 +1,20 @@
---
id: useIsRestoring
title: useIsRestoring
---
```ts
function useIsRestoring(): Accessor<boolean>;
```
Defined in: [packages/solid-query/src/isRestoring.ts:13](https://github.com/TanStack/query/blob/main/packages/solid-query/src/isRestoring.ts#L13)
If you are using `PersistQueryClientProvider`, you can also use the `useIsRestoring` hook alongside it to
check if a restore is currently in progress. `useQuery` and friends also check this internally to avoid
race conditions between the restore and mounting queries.
## Returns
`Accessor`\<`boolean`\>
An accessor that reads `true` while a persisted client is being restored, `false` otherwise.

View File

@@ -0,0 +1,201 @@
---
id: useMutation
title: useMutation
redirect_from:
- framework/solid/reference/useMutation
---
```ts
function useMutation<TData, TError, TVariables, TOnMutateResult>(options, queryClient?): UseMutationResult<TData, TError, TVariables, TOnMutateResult>;
```
Defined in: [packages/solid-query/src/useMutation.ts:173](https://github.com/TanStack/query/blob/main/packages/solid-query/src/useMutation.ts#L173)
## Type Parameters
### TData
`TData` = `unknown`
### TError
`TError` = `Error`
### TVariables
`TVariables` = `void`
### TOnMutateResult
`TOnMutateResult` = `unknown`
## Parameters
### options
[`UseMutationOptions`](../type-aliases/UseMutationOptions.md)\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>
An accessor returning the [UseMutationOptions](../type-aliases/UseMutationOptions.md) to use.
### queryClient?
`Accessor`\<[`QueryClient`](../classes/QueryClient.md)\>
An accessor for a custom `QueryClient`. Otherwise, the one from the nearest context
will be used.
## Returns
[`UseMutationResult`](../type-aliases/UseMutationResult.md)\<`TData`, `TError`, `TVariables`, `TOnMutateResult`\>
`mutate`/`mutateAsync` also accept per-call `onSuccess`/`onError`/`onSettled` callbacks as a second
argument, useful for triggering call-site side effects (e.g. navigation) without coupling them to the shared
mutation definition. Hook-level callbacks (passed to `options`) fire for every mutation; per-call callbacks
fire only for the latest call you've made, and only while the component is still mounted — unmounting before
the mutation settles removes the subscription and prevents them from firing.
## Examples
```tsx
import { useMutation, useQueryClient } from '@tanstack/solid-query'
function TodoItem(props: { id: number }) {
const queryClient = useQueryClient()
const deleteTodoMutation = useMutation(() => ({
mutationFn: deleteTodo,
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ['todos'] })
},
}))
return (
<button onClick={() => deleteTodoMutation.mutate({ id: props.id })} disabled={deleteTodoMutation.isPending}>
Delete
</button>
)
}
```
Rendering the mutation's own state, rather than just firing it off:
```tsx
import { Match, Switch } from 'solid-js'
import { useMutation, useQueryClient } from '@tanstack/solid-query'
function AddTodo() {
const queryClient = useQueryClient()
const addMutation = useMutation(() => ({
mutationFn: addTodo,
onSuccess: () => queryClient.invalidateQueries({ queryKey: ['todos'] }),
}))
return (
<Switch fallback={<button onClick={() => addMutation.mutate('Item')}>Add</button>}>
<Match when={addMutation.isPending}>Adding todo...</Match>
<Match when={addMutation.isError}>
<div>An error occurred: {addMutation.error?.message}</div>
<button onClick={() => addMutation.mutate('Item')}>Add</button>
</Match>
</Switch>
)
}
```
Optimistic update via `onMutate`, rolling back on `onError`:
```tsx
import { useMutation, useQueryClient } from '@tanstack/solid-query'
function AddTodo() {
const queryClient = useQueryClient()
const addMutation = useMutation(() => ({
mutationFn: addTodo,
onMutate: async (newTodo) => {
await queryClient.cancelQueries({ queryKey: ['todos'] })
const previousTodos = queryClient.getQueryData<Array<string>>(['todos'])
queryClient.setQueryData<Array<string>>(['todos'], (old) => [
...(old ?? []),
newTodo,
])
// Passed to `onError` as `onMutateResult` if the mutation fails.
return { previousTodos }
},
onError: (_err, _newTodo, onMutateResult) => {
queryClient.setQueryData(['todos'], onMutateResult?.previousTodos)
},
onSettled: () => {
queryClient.invalidateQueries({ queryKey: ['todos'] })
},
}))
return (
<button onClick={() => addMutation.mutate('Item')}>Add</button>
)
}
```
Callbacks passed per call to `mutate` only fire for the last call — `mutateAsync` gives you a
promise per call instead, so you can wait for all of them when they succeed:
```tsx
import { useMutation, useQueryClient } from '@tanstack/solid-query'
function AddTodos() {
const queryClient = useQueryClient()
const addMutation = useMutation(() => ({
mutationFn: addTodo,
onSuccess: () => queryClient.invalidateQueries({ queryKey: ['todos'] }),
}))
async function handleAddAll(todos: Array<string>) {
try {
await Promise.all(todos.map((todo) => addMutation.mutateAsync(todo)))
} catch (error) {
console.error('Failed to add todos:', error)
}
}
return (
<button onClick={() => handleAddAll(['Todo 1', 'Todo 2', 'Todo 3'])}>
Add all
</button>
)
}
```
If some of the mutations above can fail independently of the others, and you want to know which ones
did — rather than losing that information the moment the first one rejects — swap `Promise.all` for
`Promise.allSettled`:
```tsx
import { useMutation, useQueryClient } from '@tanstack/solid-query'
function AddTodos() {
const queryClient = useQueryClient()
const addMutation = useMutation(() => ({
mutationFn: addTodo,
onSuccess: () => queryClient.invalidateQueries({ queryKey: ['todos'] }),
}))
async function handleAddAll(todos: Array<string>) {
const addResults = await Promise.allSettled(
todos.map((todo) => addMutation.mutateAsync(todo)),
)
addResults.forEach((addResult, index) => {
if (addResult.status === 'rejected') {
console.error(`Failed to add "${todos[index]}":`, addResult.reason)
}
})
}
return (
<button onClick={() => handleAddAll(['Todo 1', 'Todo 2', 'Todo 3'])}>
Add all
</button>
)
}
```

View File

@@ -0,0 +1,109 @@
---
id: useMutationState
title: useMutationState
redirect_from:
- framework/solid/reference/useMutationState
---
```ts
function useMutationState<TResult, TMutation>(options, queryClient?): Accessor<TResult[]>;
```
Defined in: [packages/solid-query/src/useMutationState.ts:124](https://github.com/TanStack/query/blob/main/packages/solid-query/src/useMutationState.ts#L124)
`useMutationState` is a hook that gives you access to all mutations in the `MutationCache`. You can pass
`filters` ([MutationFilters](../interfaces/MutationFilters.md)) to narrow down your mutations, and `select` to transform the mutation
state.
## Type Parameters
### TResult
`TResult` = [`MutationState`](../interfaces/MutationState.md)\<`unknown`, `Error`, `unknown`, `unknown`\>
### TMutation
`TMutation` *extends* [`Mutation`](../classes/Mutation.md)\<`any`, `any`, `any`, `any`\> = `MutationTypeFromResult`\<`TResult`\>
## Parameters
### options
`Accessor`\<`MutationStateOptions`\<`TResult`, `TMutation`\>\> = `...`
An accessor returning the `filters` to narrow down matched mutations, and an optional
`select` to transform the mutation state.
### queryClient?
`Accessor`\<[`QueryClient`](../classes/QueryClient.md)\>
An accessor for a custom `QueryClient`. Otherwise, the one from the nearest context
will be used.
## Returns
`Accessor`\<`TResult`[]\>
An accessor for an array of whatever `select` returns for each matching mutation.
## Examples
Get all variables of all running mutations:
```tsx
import { useMutationState } from '@tanstack/solid-query'
function PendingPosts() {
const pendingVariables = useMutationState(() => ({
filters: { status: 'pending' },
select: (mutation) => mutation.state.variables,
}))
return <>{pendingVariables().length} posts saving...</>
}
```
Get all data for specific mutations via the `mutationKey`:
```tsx
import { useMutation, useMutationState } from '@tanstack/solid-query'
const mutationKey = ['posts']
function Posts() {
// Some mutation that we want to get the state for
const createPostsMutation = useMutation(() => ({
mutationKey,
mutationFn: createPosts,
}))
const savedPosts = useMutationState(() => ({
// this mutation key needs to match the mutation key of the given mutation (see above)
filters: { mutationKey, status: 'success' },
select: (mutation) => mutation.state.data,
}))
return (
<button onClick={() => createPostsMutation.mutate(['New Post'])}>
Create post ({savedPosts().length} saved so far)
</button>
)
}
```
Access the latest successful mutation data via the `mutationKey`. Each invocation of `mutate` adds a new
entry to the mutation cache for `gcTime` milliseconds — with the `status: 'success'` filter below, check the
last item that `useMutationState` returns to get the latest successful invocation:
```tsx
import { useMutationState } from '@tanstack/solid-query'
function LatestPost() {
const savedPosts = useMutationState(() => ({
filters: { mutationKey: ['posts'], status: 'success' },
select: (mutation) => mutation.state.data,
}))
const latestPost = () => savedPosts()[savedPosts().length - 1]
return <span>{latestPost()?.title}</span>
}
```

View File

@@ -0,0 +1,156 @@
---
id: useQueries
title: useQueries
redirect_from:
- framework/solid/reference/useQueries
---
```ts
function useQueries<T, TCombinedResult>(queriesOptions, queryClient?): TCombinedResult;
```
Defined in: [packages/solid-query/src/useQueries.ts:274](https://github.com/TanStack/query/blob/main/packages/solid-query/src/useQueries.ts#L274)
The `useQueries` hook can be used to fetch a variable number of queries.
The `queries` key accepts an array with query option objects mostly identical to `useQuery` — see
`placeholderData` below for the one difference. A custom `QueryClient` is supplied once, as `useQueries`'
own top-level second argument, rather than per query.
Having the same query key more than once in the array of query objects may cause some data to be shared
between queries. To avoid this, consider de-duplicating the queries and map the results back to the desired
structure.
The `combine` option can be used to combine the results of the queries into a single value. The result will
be structurally shared to be as referentially stable as possible.
`placeholderData` is supported here too, but unlike `useQuery`, it doesn't receive information from
previously rendered queries, because the number of queries can differ between renders.
## Type Parameters
### T
`T` *extends* `any`[]
### TCombinedResult
`TCombinedResult` *extends*
\| \[\]
\| \[
\| [`QueryObserverRefetchErrorResult`](../interfaces/QueryObserverRefetchErrorResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverSuccessResult`](../interfaces/QueryObserverSuccessResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverLoadingErrorResult`](../interfaces/QueryObserverLoadingErrorResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverLoadingResult`](../interfaces/QueryObserverLoadingResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverPendingResult`](../interfaces/QueryObserverPendingResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverPlaceholderResult`](../interfaces/QueryObserverPlaceholderResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverRefetchErrorResult`](../interfaces/QueryObserverRefetchErrorResult.md)\<`unknown`, `unknown`\>
\| [`QueryObserverSuccessResult`](../interfaces/QueryObserverSuccessResult.md)\<`unknown`, `unknown`\>
\| [`QueryObserverLoadingErrorResult`](../interfaces/QueryObserverLoadingErrorResult.md)\<`unknown`, `unknown`\>
\| [`QueryObserverLoadingResult`](../interfaces/QueryObserverLoadingResult.md)\<`unknown`, `unknown`\>
\| [`QueryObserverPendingResult`](../interfaces/QueryObserverPendingResult.md)\<`unknown`, `unknown`\>
\| [`QueryObserverPlaceholderResult`](../interfaces/QueryObserverPlaceholderResult.md)\<`unknown`, `unknown`\>\]
\| (
\| [`QueryObserverRefetchErrorResult`](../interfaces/QueryObserverRefetchErrorResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverSuccessResult`](../interfaces/QueryObserverSuccessResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverLoadingErrorResult`](../interfaces/QueryObserverLoadingErrorResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverLoadingResult`](../interfaces/QueryObserverLoadingResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverPendingResult`](../interfaces/QueryObserverPendingResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverPlaceholderResult`](../interfaces/QueryObserverPlaceholderResult.md)\<`unknown`, `Error`\>
\| [`QueryObserverRefetchErrorResult`](../interfaces/QueryObserverRefetchErrorResult.md)\<`unknown`, `unknown`\>
\| [`QueryObserverSuccessResult`](../interfaces/QueryObserverSuccessResult.md)\<`unknown`, `unknown`\>
\| [`QueryObserverLoadingErrorResult`](../interfaces/QueryObserverLoadingErrorResult.md)\<`unknown`, `unknown`\>
\| [`QueryObserverLoadingResult`](../interfaces/QueryObserverLoadingResult.md)\<`unknown`, `unknown`\>
\| [`QueryObserverPendingResult`](../interfaces/QueryObserverPendingResult.md)\<`unknown`, `unknown`\>
\| [`QueryObserverPlaceholderResult`](../interfaces/QueryObserverPlaceholderResult.md)\<`unknown`, `unknown`\>)[] = `T` *extends* \[\] ? \[\] : `T` *extends* \[`Head`\] ? \[`GetResults`\<`Head`\>\] : `T` *extends* \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] *extends* \[\] ? \[\] : \[`...Tail[]`\] *extends* \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] *extends* \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] *extends* \[\] ? \[\] : \[`...Tail[]`\] *extends* \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] *extends* \[`Head`, `...Tail[]`\] ? \[`...(...)[]`\] *extends* \[\] ? \[\] : ... *extends* ... ? ... : ... : \[`...{ [K in (...)]: (...) }[]`\] : \[...\{ \[K in string \| number \| symbol\]: GetResults\<Tail\[K\<(...)\>\]\> \}\[\]\] : \{ \[K in string \| number \| symbol\]: GetResults\<T\[K\<K\>\]\> \}
## Parameters
### queriesOptions
`Accessor`\<\{
`combine?`: (`result`) => `TCombinedResult`;
`queries`: \| readonly \[`T` *extends* \[\] ? \[\] : `T` *extends* \[`Head`\] ? \[`GetOptions`\<`Head`\>\] : `T` *extends* \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] *extends* \[\] ? \[\] : \[`...Tail[]`\] *extends* \[`Head`\] ? \[`GetOptions`\<...\>, `GetOptions`\<...\>\] : \[`...(...)[]`\] *extends* \[..., `...(...)[]`\] ? ... *extends* ... ? ... : ... : ... *extends* ... ? ... : ... : readonly `unknown`[] *extends* `T` ? `T` : `T` *extends* `UseQueryOptionsForUseQueries`\<..., ..., ..., ...\>[] ? `UseQueryOptionsForUseQueries`\<..., ..., ..., ...\>[] : `UseQueryOptionsForUseQueries`\<..., ..., ..., ...\>[]\]
\| readonly \[\{ \[K in string \| number \| symbol\]: GetOptions\<T\[K\<K\>\]\> \}\];
\}\>
An accessor returning the `queries` array to run, and an optional `combine`
function.
### queryClient?
`Accessor`\<[`QueryClient`](../classes/QueryClient.md)\>
An accessor for a custom `QueryClient`. Otherwise, the one from the nearest context
will be used.
## Returns
`TCombinedResult`
The combined result. Without `combine`, this is an array with all the query results, in the same
order as the input. When `combine` is provided, this is the value returned by `combine` instead.
## Examples
```tsx
import { For } from 'solid-js'
import { useQueries } from '@tanstack/solid-query'
function Posts(props: { ids: Array<number> }) {
const postQueries = useQueries(() => ({
queries: props.ids.map((id) => ({
queryKey: ['post', id],
queryFn: () => fetchPost(id),
staleTime: Infinity,
})),
}))
return (
<ul>
<For each={postQueries}>
{(postQuery) => {
if (postQuery.isPending) return <li>Loading...</li>
if (postQuery.isError) return <li>Error: {postQuery.error.message}</li>
return <li>{postQuery.data.title}</li>
}}
</For>
</ul>
)
}
```
Combining results into a single value:
```tsx
import { For, Match, Switch } from 'solid-js'
import { useQueries } from '@tanstack/solid-query'
function Posts(props: { ids: Array<number> }) {
const combinedPostsQuery = useQueries(() => ({
queries: props.ids.map((id) => ({
queryKey: ['post', id],
queryFn: () => fetchPost(id),
})),
combine: (postQueries) => {
return {
data: postQueries.map((postQuery) => postQuery.data),
isPending: postQueries.some((postQuery) => postQuery.isPending),
isError: postQueries.some((postQuery) => postQuery.isError),
}
},
}))
return (
<Switch
fallback={
<ul>
<For each={combinedPostsQuery.data}>{(post) => <li>{post?.title}</li>}</For>
</ul>
}
>
<Match when={combinedPostsQuery.isPending}>Loading...</Match>
<Match when={combinedPostsQuery.isError}>Error loading posts</Match>
</Switch>
)
}
```

View File

@@ -0,0 +1,290 @@
---
id: useQuery
title: useQuery
redirect_from:
- framework/solid/reference/useQuery
---
## Call Signature
```ts
function useQuery<TQueryFnData, TError, TData, TQueryKey>(options, queryClient?): UseQueryResult<TData, TError>;
```
Defined in: [packages/solid-query/src/useQuery.ts:178](https://github.com/TanStack/query/blob/main/packages/solid-query/src/useQuery.ts#L178)
### Type Parameters
#### TQueryFnData
`TQueryFnData` = `unknown`
#### TError
`TError` = `Error`
#### TData
`TData` = `TQueryFnData`
#### TQueryKey
`TQueryKey` *extends* readonly `unknown`[] = readonly `unknown`[]
### Parameters
#### options
[`UndefinedInitialDataOptions`](../type-aliases/UndefinedInitialDataOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\>
An accessor returning the [UndefinedInitialDataOptions](../type-aliases/UndefinedInitialDataOptions.md) to use — everything you can
pass to `useQuery`.
#### queryClient?
() => [`QueryClient`](../classes/QueryClient.md)
An accessor for a custom `QueryClient`. Otherwise, the one from the nearest context
will be used.
### Returns
[`UseQueryResult`](../type-aliases/UseQueryResult.md)\<`TData`, `TError`\>
The current query result, as a Solid store. `status` is `pending` if there is no cached data to
display, `error` if the last fetch attempt failed, or `success` if the query has data to display.
`isPending`/`isSuccess`/`isError` are derived booleans for convenience.
### See
[queryOptions](queryOptions.md) to share these options between `useQuery` and imperative APIs like `queryClient.query`.
### Examples
```tsx
import { For, Match, Switch } from 'solid-js'
import { useQuery } from '@tanstack/solid-query'
function Posts() {
const postsQuery = useQuery(() => ({
queryKey: ['posts'],
queryFn: fetchPosts,
}))
return (
<Switch>
<Match when={postsQuery.isPending}>Loading...</Match>
<Match when={postsQuery.isError}>Error: {postsQuery.error.message}</Match>
<Match when={postsQuery.isSuccess}>
<ul>
<For each={postsQuery.data}>{(post) => <li>{post.title}</li>}</For>
</ul>
<div>{postsQuery.isFetching ? 'Background Updating...' : ' '}</div>
</Match>
</Switch>
)
}
```
`select` derives whatever `data` a component needs from the cached value, without changing what's
actually stored in the cache — the cache still holds the full `Post[]`, but `data` here is a `number`:
```tsx
import { Match, Switch } from 'solid-js'
import { useQuery } from '@tanstack/solid-query'
function PostCount() {
const postsQuery = useQuery(() => ({
queryKey: ['posts'],
queryFn: fetchPosts,
select: (posts) => posts.length,
}))
return (
<Switch>
<Match when={postsQuery.isPending}>Loading...</Match>
<Match when={postsQuery.isError}>Error: {postsQuery.error.message}</Match>
<Match when={postsQuery.isSuccess}>{postsQuery.data} posts</Match>
</Switch>
)
}
```
A dependent query, only enabled once `postId` is set:
```tsx
import { Match, Switch } from 'solid-js'
import { useQuery } from '@tanstack/solid-query'
function Post(props: { postId: number | undefined }) {
const postQuery = useQuery(() => ({
queryKey: ['post', props.postId],
queryFn: () => fetchPost(props.postId!),
enabled: props.postId != null,
}))
return (
<Switch fallback={<h1>{postQuery.data?.title}</h1>}>
<Match when={props.postId == null}>Select a post</Match>
<Match when={postQuery.isLoading}>Loading...</Match>
<Match when={postQuery.isError}>Error: {postQuery.error.message}</Match>
</Switch>
)
}
```
The same dependent query, using `skipToken` to disable it in a type-safe way instead of relying on
`enabled`. The non-null assertion is still needed — Solid's `props` narrowing doesn't survive into the
`queryFn` closure the way a local `const` would — but `skipToken` keeps `queryFn`'s return type accurate
without it. `refetch` doesn't work while `queryFn` is `skipToken` — use `enabled: false` instead if you
need to trigger the query manually:
```tsx
import { Match, Switch } from 'solid-js'
import { skipToken, useQuery } from '@tanstack/solid-query'
function Post(props: { postId: number | undefined }) {
const postQuery = useQuery(() => ({
queryKey: ['post', props.postId],
queryFn: props.postId != null ? () => fetchPost(props.postId!) : skipToken,
}))
return (
<Switch fallback={<h1>{postQuery.data?.title}</h1>}>
<Match when={props.postId == null}>Select a post</Match>
<Match when={postQuery.isLoading}>Loading...</Match>
<Match when={postQuery.isError}>Error: {postQuery.error.message}</Match>
</Switch>
)
}
```
Seeding a detail query from an already-cached list, to skip the loading state:
```tsx
import { useQuery, useQueryClient } from '@tanstack/solid-query'
function Post(props: { postId: number }) {
const queryClient = useQueryClient()
const postQuery = useQuery(() => ({
queryKey: ['post', props.postId],
queryFn: () => fetchPost(props.postId),
initialData: () =>
queryClient
.getQueryData<Array<Post>>(['posts'])
?.find((post) => post.id === props.postId),
}))
return postQuery.isError ? <span>Error: {postQuery.error.message}</span> : <h1>{postQuery.data?.title}</h1>
}
```
Paginated data, keeping the previous page's data visible while the next page loads:
```tsx
import { For, createSignal } from 'solid-js'
import { keepPreviousData, useQuery } from '@tanstack/solid-query'
function Posts() {
const [page, setPage] = createSignal(0)
const postsQuery = useQuery(() => ({
queryKey: ['posts', page()],
queryFn: () => fetchPosts(page()),
placeholderData: keepPreviousData,
}))
return (
<div>
<ul>
<For each={postsQuery.data}>{(post) => <li>{post.title}</li>}</For>
</ul>
<button
disabled={postsQuery.isPlaceholderData}
onClick={() => setPage((old) => old + 1)}
>
Next Page
</button>
</div>
)
}
```
## Call Signature
```ts
function useQuery<TQueryFnData, TError, TData, TQueryKey>(options, queryClient?): DefinedUseQueryResult<TData, TError>;
```
Defined in: [packages/solid-query/src/useQuery.ts:226](https://github.com/TanStack/query/blob/main/packages/solid-query/src/useQuery.ts#L226)
This overload is selected when `initialData` is set, so the resulting `data` is never `undefined`.
### Type Parameters
#### TQueryFnData
`TQueryFnData` = `unknown`
#### TError
`TError` = `Error`
#### TData
`TData` = `TQueryFnData`
#### TQueryKey
`TQueryKey` *extends* readonly `unknown`[] = readonly `unknown`[]
### Parameters
#### options
[`DefinedInitialDataOptions`](../type-aliases/DefinedInitialDataOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\>
An accessor returning the [DefinedInitialDataOptions](../type-aliases/DefinedInitialDataOptions.md) to use — everything you can
pass to `useQuery`, with `initialData` set.
#### queryClient?
() => [`QueryClient`](../classes/QueryClient.md)
An accessor for a custom `QueryClient`. Otherwise, the one from the nearest context
will be used.
### Returns
[`DefinedUseQueryResult`](../type-aliases/DefinedUseQueryResult.md)\<`TData`, `TError`\>
The current query result, as a Solid store, typed so that `status` is `success` — or `error` if a
fetch attempt fails while keeping the existing data (`status` never resolves to `pending` in this overload's
type, since `initialData` guarantees data upfront). `isSuccess`/`isError` are derived booleans for
convenience.
### See
[queryOptions](queryOptions.md) to share these options between `useQuery` and imperative APIs like `queryClient.query`.
### Example
```tsx
import { For } from 'solid-js'
import { useQuery } from '@tanstack/solid-query'
function Posts() {
// `postsQuery.data` is never `undefined`, thanks to `initialData` — even if a refetch fails, so the
// list stays visible alongside the error.
const postsQuery = useQuery(() => ({
queryKey: ['posts'],
queryFn: fetchPosts,
initialData: [],
}))
return (
<div>
{postsQuery.isError ? <span>Error: {postsQuery.error.message}</span> : null}
<ul>
<For each={postsQuery.data}>{(post) => <li>{post.title}</li>}</For>
</ul>
</div>
)
}
```

View File

@@ -0,0 +1,31 @@
---
id: useQueryClient
title: useQueryClient
---
```ts
function useQueryClient(queryClient?): QueryClient;
```
Defined in: [packages/solid-query/src/QueryClientProvider.tsx:28](https://github.com/TanStack/query/blob/main/packages/solid-query/src/QueryClientProvider.tsx#L28)
The `useQueryClient` hook returns the current `QueryClient` instance.
## Parameters
### queryClient?
[`QueryClient`](../classes/QueryClient.md)
Use this to use a custom `QueryClient`. Otherwise, the one from the nearest context will
be used.
## Returns
[`QueryClient`](../classes/QueryClient.md)
The current `QueryClient` instance.
## Throws
If no `queryClient` argument is passed and no `QueryClientProvider` is found in the component tree.

View File

@@ -0,0 +1,313 @@
---
id: "@tanstack/solid-query"
title: "@tanstack/solid-query"
---
## Classes
- [CancelledError](classes/CancelledError.md)
- [InfiniteQueryObserver](classes/InfiniteQueryObserver.md)
- [Mutation](classes/Mutation.md)
- [MutationCache](classes/MutationCache.md)
- [MutationObserver](classes/MutationObserver.md)
- [QueriesObserver](classes/QueriesObserver.md)
- [Query](classes/Query.md)
- [QueryCache](classes/QueryCache.md)
- [QueryClient](classes/QueryClient.md)
- [QueryObserver](classes/QueryObserver.md)
## Interfaces
- [CancelOptions](interfaces/CancelOptions.md)
- [DefaultOptions](interfaces/DefaultOptions.md)
- [DehydratedState](interfaces/DehydratedState.md)
- [DehydrateOptions](interfaces/DehydrateOptions.md)
- [~~EnsureQueryDataOptions~~](interfaces/EnsureQueryDataOptions.md)
- [FetchNextPageOptions](interfaces/FetchNextPageOptions.md)
- [FetchPreviousPageOptions](interfaces/FetchPreviousPageOptions.md)
- [~~FetchQueryOptions~~](interfaces/FetchQueryOptions.md)
- [FocusManager](interfaces/FocusManager.md)
- [HydrateOptions](interfaces/HydrateOptions.md)
- [InfiniteData](interfaces/InfiniteData.md)
- [InfiniteQueryObserverBaseResult](interfaces/InfiniteQueryObserverBaseResult.md)
- [InfiniteQueryObserverLoadingErrorResult](interfaces/InfiniteQueryObserverLoadingErrorResult.md)
- [InfiniteQueryObserverLoadingResult](interfaces/InfiniteQueryObserverLoadingResult.md)
- [InfiniteQueryObserverOptions](interfaces/InfiniteQueryObserverOptions.md)
- [InfiniteQueryObserverPendingResult](interfaces/InfiniteQueryObserverPendingResult.md)
- [InfiniteQueryObserverPlaceholderResult](interfaces/InfiniteQueryObserverPlaceholderResult.md)
- [InfiniteQueryObserverRefetchErrorResult](interfaces/InfiniteQueryObserverRefetchErrorResult.md)
- [InfiniteQueryObserverSuccessResult](interfaces/InfiniteQueryObserverSuccessResult.md)
- [InfiniteQueryOptions](interfaces/InfiniteQueryOptions.md)
- [InfiniteQueryPageParamsOptions](interfaces/InfiniteQueryPageParamsOptions.md)
- [InitialPageParam](interfaces/InitialPageParam.md)
- [InvalidateOptions](interfaces/InvalidateOptions.md)
- [InvalidateQueryFilters](interfaces/InvalidateQueryFilters.md)
- [MutateOptions](interfaces/MutateOptions.md)
- [MutationCacheConfig](interfaces/MutationCacheConfig.md)
- [MutationFilters](interfaces/MutationFilters.md)
- [MutationObserverBaseResult](interfaces/MutationObserverBaseResult.md)
- [MutationObserverErrorResult](interfaces/MutationObserverErrorResult.md)
- [MutationObserverIdleResult](interfaces/MutationObserverIdleResult.md)
- [MutationObserverLoadingResult](interfaces/MutationObserverLoadingResult.md)
- [MutationObserverOptions](interfaces/MutationObserverOptions.md)
- [MutationObserverSuccessResult](interfaces/MutationObserverSuccessResult.md)
- [MutationOptions](interfaces/MutationOptions.md)
- [MutationState](interfaces/MutationState.md)
- [NotifyEvent](interfaces/NotifyEvent.md)
- [OnlineManager](interfaces/OnlineManager.md)
- [QueriesObserverOptions](interfaces/QueriesObserverOptions.md)
- [QueryCacheConfig](interfaces/QueryCacheConfig.md)
- [QueryClientConfig](interfaces/QueryClientConfig.md)
- [QueryExecuteOptions](interfaces/QueryExecuteOptions.md)
- [QueryFilters](interfaces/QueryFilters.md)
- [QueryObserverBaseResult](interfaces/QueryObserverBaseResult.md)
- [QueryObserverLoadingErrorResult](interfaces/QueryObserverLoadingErrorResult.md)
- [QueryObserverLoadingResult](interfaces/QueryObserverLoadingResult.md)
- [QueryObserverOptions](interfaces/QueryObserverOptions.md)
- [QueryObserverPendingResult](interfaces/QueryObserverPendingResult.md)
- [QueryObserverPlaceholderResult](interfaces/QueryObserverPlaceholderResult.md)
- [QueryObserverRefetchErrorResult](interfaces/QueryObserverRefetchErrorResult.md)
- [QueryObserverSuccessResult](interfaces/QueryObserverSuccessResult.md)
- [QueryOptions](interfaces/QueryOptions.md)
- [QueryState](interfaces/QueryState.md)
- [RefetchOptions](interfaces/RefetchOptions.md)
- [RefetchQueryFilters](interfaces/RefetchQueryFilters.md)
- [Register](interfaces/Register.md)
- [ResetOptions](interfaces/ResetOptions.md)
- [ResultOptions](interfaces/ResultOptions.md)
- [SetDataOptions](interfaces/SetDataOptions.md)
- [TimeoutManager](interfaces/TimeoutManager.md)
- [UseBaseQueryOptions](interfaces/UseBaseQueryOptions.md)
## Type Aliases
- [AnyDataTag](type-aliases/AnyDataTag.md)
- [DataTag](type-aliases/DataTag.md)
- [dataTagErrorSymbol](type-aliases/dataTagErrorSymbol.md)
- [dataTagSymbol](type-aliases/dataTagSymbol.md)
- [DefaultedInfiniteQueryObserverOptions](type-aliases/DefaultedInfiniteQueryObserverOptions.md)
- [DefaultedQueryObserverOptions](type-aliases/DefaultedQueryObserverOptions.md)
- [DefaultError](type-aliases/DefaultError.md)
- [DefinedInfiniteQueryObserverResult](type-aliases/DefinedInfiniteQueryObserverResult.md)
- [DefinedInitialDataInfiniteOptions](type-aliases/DefinedInitialDataInfiniteOptions.md)
- [DefinedInitialDataOptions](type-aliases/DefinedInitialDataOptions.md)
- [DefinedQueryObserverResult](type-aliases/DefinedQueryObserverResult.md)
- [DefinedUseBaseQueryResult](type-aliases/DefinedUseBaseQueryResult.md)
- [DefinedUseInfiniteQueryResult](type-aliases/DefinedUseInfiniteQueryResult.md)
- [DefinedUseQueryResult](type-aliases/DefinedUseQueryResult.md)
- [DistributiveOmit](type-aliases/DistributiveOmit.md)
- [~~EnsureInfiniteQueryDataOptions~~](type-aliases/EnsureInfiniteQueryDataOptions.md)
- [~~FetchInfiniteQueryOptions~~](type-aliases/FetchInfiniteQueryOptions.md)
- [FetchStatus](type-aliases/FetchStatus.md)
- [GetNextPageParamFunction](type-aliases/GetNextPageParamFunction.md)
- [GetPreviousPageParamFunction](type-aliases/GetPreviousPageParamFunction.md)
- [InferDataFromTag](type-aliases/InferDataFromTag.md)
- [InferErrorFromTag](type-aliases/InferErrorFromTag.md)
- [InfiniteQueryExecuteOptions](type-aliases/InfiniteQueryExecuteOptions.md)
- [InfiniteQueryObserverResult](type-aliases/InfiniteQueryObserverResult.md)
- [InitialDataFunction](type-aliases/InitialDataFunction.md)
- [ManagedTimerId](type-aliases/ManagedTimerId.md)
- [MutateFunction](type-aliases/MutateFunction.md)
- [MutateFunctionRest](type-aliases/MutateFunctionRest.md)
- [MutationCacheNotifyEvent](type-aliases/MutationCacheNotifyEvent.md)
- [MutationFunction](type-aliases/MutationFunction.md)
- [MutationFunctionContext](type-aliases/MutationFunctionContext.md)
- [MutationKey](type-aliases/MutationKey.md)
- [MutationMeta](type-aliases/MutationMeta.md)
- [MutationObserverResult](type-aliases/MutationObserverResult.md)
- [MutationScope](type-aliases/MutationScope.md)
- [MutationStatus](type-aliases/MutationStatus.md)
- [NetworkMode](type-aliases/NetworkMode.md)
- [NonUndefinedGuard](type-aliases/NonUndefinedGuard.md)
- [NotifyEventType](type-aliases/NotifyEventType.md)
- [NotifyOnChangeProps](type-aliases/NotifyOnChangeProps.md)
- [OmitKeyof](type-aliases/OmitKeyof.md)
- [Override](type-aliases/Override.md)
- [PlaceholderDataFunction](type-aliases/PlaceholderDataFunction.md)
- [QueriesPlaceholderDataFunction](type-aliases/QueriesPlaceholderDataFunction.md)
- [QueryBooleanOption](type-aliases/QueryBooleanOption.md)
- [QueryCacheNotifyEvent](type-aliases/QueryCacheNotifyEvent.md)
- [QueryClientProviderProps](type-aliases/QueryClientProviderProps.md)
- [QueryFunction](type-aliases/QueryFunction.md)
- [QueryFunctionContext](type-aliases/QueryFunctionContext.md)
- [QueryKey](type-aliases/QueryKey.md)
- [QueryKeyHashFunction](type-aliases/QueryKeyHashFunction.md)
- [QueryKeyWithDataTag](type-aliases/QueryKeyWithDataTag.md)
- [QueryMeta](type-aliases/QueryMeta.md)
- [QueryObserverResult](type-aliases/QueryObserverResult.md)
- [QueryPersister](type-aliases/QueryPersister.md)
- [QueryStatus](type-aliases/QueryStatus.md)
- [SkipToken](type-aliases/SkipToken.md)
- [StaleTime](type-aliases/StaleTime.md)
- [StaleTimeFunction](type-aliases/StaleTimeFunction.md)
- [ThrowOnError](type-aliases/ThrowOnError.md)
- [TimeoutCallback](type-aliases/TimeoutCallback.md)
- [TimeoutProvider](type-aliases/TimeoutProvider.md)
- [UndefinedInitialDataInfiniteOptions](type-aliases/UndefinedInitialDataInfiniteOptions.md)
- [UndefinedInitialDataOptions](type-aliases/UndefinedInitialDataOptions.md)
- [UnsetMarker](type-aliases/UnsetMarker.md)
- [Updater](type-aliases/Updater.md)
- [UseBaseMutationResult](type-aliases/UseBaseMutationResult.md)
- [UseBaseQueryResult](type-aliases/UseBaseQueryResult.md)
- [UseInfiniteQueryOptions](type-aliases/UseInfiniteQueryOptions.md)
- [UseInfiniteQueryResult](type-aliases/UseInfiniteQueryResult.md)
- [UseMutateAsyncFunction](type-aliases/UseMutateAsyncFunction.md)
- [UseMutateFunction](type-aliases/UseMutateFunction.md)
- [UseMutationOptions](type-aliases/UseMutationOptions.md)
- [UseMutationResult](type-aliases/UseMutationResult.md)
- [UseQueryOptions](type-aliases/UseQueryOptions.md)
- [UseQueryResult](type-aliases/UseQueryResult.md)
- [WithRequired](type-aliases/WithRequired.md)
## Variables
- [createInfiniteQuery](variables/createInfiniteQuery.md)
- [createMutation](variables/createMutation.md)
- [createQueries](variables/createQueries.md)
- [createQuery](variables/createQuery.md)
- [dataTagErrorSymbol](variables/dataTagErrorSymbol.md)
- [dataTagSymbol](variables/dataTagSymbol.md)
- [defaultScheduler](variables/defaultScheduler.md)
- [environmentManager](variables/environmentManager.md)
- [focusManager](variables/focusManager.md)
- [IsRestoringProvider](variables/IsRestoringProvider.md)
- [~~isServer~~](variables/isServer.md)
- [notifyManager](variables/notifyManager.md)
- [onlineManager](variables/onlineManager.md)
- [QueryClientContext](variables/QueryClientContext.md)
- [skipToken](variables/skipToken.md)
- [timeoutManager](variables/timeoutManager.md)
- [unsetMarker](variables/unsetMarker.md)
## Functions
- [defaultShouldDehydrateMutation](functions/defaultShouldDehydrateMutation.md)
- [defaultShouldDehydrateQuery](functions/defaultShouldDehydrateQuery.md)
- [dehydrate](functions/dehydrate.md)
- [dehydrateQuery](functions/dehydrateQuery.md)
- [experimental\_streamedQuery](functions/experimental_streamedQuery.md)
- [hashKey](functions/hashKey.md)
- [hydrate](functions/hydrate.md)
- [infiniteQueryOptions](functions/infiniteQueryOptions.md)
- [~~isCancelledError~~](functions/isCancelledError.md)
- [keepPreviousData](functions/keepPreviousData.md)
- [matchMutation](functions/matchMutation.md)
- [matchQuery](functions/matchQuery.md)
- [mutationOptions](functions/mutationOptions.md)
- [noop](functions/noop.md)
- [partialMatchKey](functions/partialMatchKey.md)
- [QueryClientProvider](functions/QueryClientProvider.md)
- [queryOptions](functions/queryOptions.md)
- [replaceEqualDeep](functions/replaceEqualDeep.md)
- [shouldThrowError](functions/shouldThrowError.md)
- [useInfiniteQuery](functions/useInfiniteQuery.md)
- [useIsFetching](functions/useIsFetching.md)
- [useIsMutating](functions/useIsMutating.md)
- [useIsRestoring](functions/useIsRestoring.md)
- [useMutation](functions/useMutation.md)
- [useMutationState](functions/useMutationState.md)
- [useQueries](functions/useQueries.md)
- [useQuery](functions/useQuery.md)
- [useQueryClient](functions/useQueryClient.md)
## References
### CreateBaseMutationResult
Renames and re-exports [UseBaseMutationResult](type-aliases/UseBaseMutationResult.md)
***
### CreateBaseQueryOptions
Renames and re-exports [UseBaseQueryOptions](interfaces/UseBaseQueryOptions.md)
***
### CreateBaseQueryResult
Renames and re-exports [UseBaseQueryResult](type-aliases/UseBaseQueryResult.md)
***
### CreateInfiniteQueryOptions
Renames and re-exports [UseInfiniteQueryOptions](type-aliases/UseInfiniteQueryOptions.md)
***
### CreateInfiniteQueryResult
Renames and re-exports [UseInfiniteQueryResult](type-aliases/UseInfiniteQueryResult.md)
***
### createIsFetching
Renames and re-exports [useIsFetching](functions/useIsFetching.md)
***
### createIsMutating
Renames and re-exports [useIsMutating](functions/useIsMutating.md)
***
### CreateMutateAsyncFunction
Renames and re-exports [UseMutateAsyncFunction](type-aliases/UseMutateAsyncFunction.md)
***
### CreateMutateFunction
Renames and re-exports [UseMutateFunction](type-aliases/UseMutateFunction.md)
***
### CreateMutationOptions
Renames and re-exports [UseMutationOptions](type-aliases/UseMutationOptions.md)
***
### CreateMutationResult
Renames and re-exports [UseMutationResult](type-aliases/UseMutationResult.md)
***
### createMutationState
Renames and re-exports [useMutationState](functions/useMutationState.md)
***
### CreateQueryOptions
Renames and re-exports [UseQueryOptions](type-aliases/UseQueryOptions.md)
***
### CreateQueryResult
Renames and re-exports [UseQueryResult](type-aliases/UseQueryResult.md)
***
### DefinedCreateBaseQueryResult
Renames and re-exports [DefinedUseBaseQueryResult](type-aliases/DefinedUseBaseQueryResult.md)
***
### DefinedCreateInfiniteQueryResult
Renames and re-exports [DefinedUseInfiniteQueryResult](type-aliases/DefinedUseInfiniteQueryResult.md)
***
### DefinedCreateQueryResult
Renames and re-exports [DefinedUseQueryResult](type-aliases/DefinedUseQueryResult.md)

View File

@@ -0,0 +1,26 @@
---
id: CancelOptions
title: CancelOptions
---
Defined in: [packages/query-core/src/types.ts:1521](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1521)
## Properties
### revert?
```ts
optional revert: boolean;
```
Defined in: [packages/query-core/src/types.ts:1522](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1522)
***
### silent?
```ts
optional silent: boolean;
```
Defined in: [packages/query-core/src/types.ts:1523](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1523)

View File

@@ -0,0 +1,117 @@
---
id: DefaultOptions
title: DefaultOptions
---
Defined in: [packages/solid-query/src/QueryClient.ts:96](https://github.com/TanStack/query/blob/main/packages/solid-query/src/QueryClient.ts#L96)
The default options a `QueryClient` applies to every query, with Solid's `reconcile` option added to
`queries`.
## Extends
- `DefaultOptions`\<`TError`\>
## Type Parameters
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
The default type of errors thrown by queries and mutations using this `QueryClient`.
## Properties
### dehydrate?
```ts
optional dehydrate: DehydrateOptions;
```
Defined in: [packages/query-core/src/types.ts:1518](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1518)
Default options used when dehydrating the client's caches; see [DehydrateOptions](DehydrateOptions.md).
#### Inherited from
```ts
CoreDefaultOptions.dehydrate
```
***
### hydrate?
```ts
optional hydrate: object;
```
Defined in: [packages/query-core/src/types.ts:1516](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1516)
Default options used when hydrating queries; see [HydrateOptions](HydrateOptions.md).
#### deserializeData?
```ts
optional deserializeData: TransformerFn;
```
Transforms a query's `data` after it is read from the dehydrated state, reversing `serializeData`.
#### mutations?
```ts
optional mutations: MutationOptions<unknown, Error, unknown, unknown>;
```
Default options merged into every mutation restored from the dehydrated state.
#### queries?
```ts
optional queries: QueryOptions<unknown, Error, unknown, readonly unknown[], never>;
```
Default options merged into every query restored from the dehydrated state.
#### Inherited from
```ts
CoreDefaultOptions.hydrate
```
***
### mutations?
```ts
optional mutations: MutationObserverOptions<unknown, TError, unknown, unknown>;
```
Defined in: [packages/query-core/src/types.ts:1514](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1514)
Default options applied to every mutation, unless overridden per-mutation.
#### Inherited from
```ts
CoreDefaultOptions.mutations
```
***
### queries?
```ts
optional queries: OmitKeyof<QueryObserverOptions<unknown, TError, unknown, unknown, readonly unknown[], never>, "queryKey">;
```
Defined in: [packages/solid-query/src/QueryClient.ts:99](https://github.com/TanStack/query/blob/main/packages/solid-query/src/QueryClient.ts#L99)
Default options applied to every query, unless overridden per-query.
#### Overrides
```ts
CoreDefaultOptions.queries
```

View File

@@ -0,0 +1,89 @@
---
id: DehydrateOptions
title: DehydrateOptions
---
Defined in: [packages/query-core/src/hydration.ts:42](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L42)
Options for `dehydrate`, controlling which queries/mutations are included in the resulting `DehydratedState` and
how their data/errors are transformed before being serialized (e.g. for embedding in server-rendered markup).
## Properties
### serializeData?
```ts
optional serializeData: TransformerFn;
```
Defined in: [packages/query-core/src/hydration.ts:44](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L44)
Transforms a query's `data` before it is dehydrated. Useful for non-JSON-serializable data.
***
### shouldDehydrateMutation()?
```ts
optional shouldDehydrateMutation: (mutation) => boolean;
```
Defined in: [packages/query-core/src/hydration.ts:46](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L46)
Predicate to decide whether a given `Mutation` should be dehydrated. Defaults to `defaultShouldDehydrateMutation`.
#### Parameters
##### mutation
[`Mutation`](../classes/Mutation.md)
#### Returns
`boolean`
***
### shouldDehydrateQuery()?
```ts
optional shouldDehydrateQuery: (query) => boolean;
```
Defined in: [packages/query-core/src/hydration.ts:48](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L48)
Predicate to decide whether a given `Query` should be dehydrated. Defaults to `defaultShouldDehydrateQuery`.
#### Parameters
##### query
[`Query`](../classes/Query.md)
#### Returns
`boolean`
***
### shouldRedactErrors()?
```ts
optional shouldRedactErrors: (error) => boolean;
```
Defined in: [packages/query-core/src/hydration.ts:54](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L54)
Predicate to decide whether a query's error should be redacted before dehydration. Errors are redacted
(replaced with a generic `Error('redacted')`) unless this function is provided and returns `false` for the
given error, in which case the original error is kept.
#### Parameters
##### error
`unknown`
#### Returns
`boolean`

View File

@@ -0,0 +1,30 @@
---
id: DehydratedState
title: DehydratedState
---
Defined in: [packages/query-core/src/hydration.ts:94](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L94)
A serializable snapshot of a `QueryClient`'s cache, as produced by `dehydrate` and consumed by `hydrate`. Typically
transported from server to client (e.g. embedded in server-rendered markup) to seed the client's cache with data
that has already been fetched, avoiding a redundant fetch on the client.
## Properties
### mutations
```ts
mutations: DehydratedMutation[];
```
Defined in: [packages/query-core/src/hydration.ts:95](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L95)
***
### queries
```ts
queries: DehydratedQuery[];
```
Defined in: [packages/query-core/src/hydration.ts:96](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L96)

View File

@@ -0,0 +1,350 @@
---
id: EnsureQueryDataOptions
title: EnsureQueryDataOptions
---
Defined in: [packages/query-core/src/types.ts:614](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L614)
## Deprecated
## Extends
- [`FetchQueryOptions`](FetchQueryOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>
## Type Parameters
### TQueryFnData
`TQueryFnData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
### TData
`TData` = `TQueryFnData`
### TQueryKey
`TQueryKey` *extends* [`QueryKey`](../type-aliases/QueryKey.md) = [`QueryKey`](../type-aliases/QueryKey.md)
### TPageParam
`TPageParam` = `never`
## Properties
### ~~gcTime?~~
```ts
optional gcTime: number;
```
Defined in: [packages/query-core/src/types.ts:277](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L277)
The time in milliseconds that unused/inactive cache data remains in memory.
When a query's cache becomes unused or inactive, that cache data will be garbage collected after this duration.
When different garbage collection times are specified, the longest one will be used.
Setting it to `Infinity` will disable garbage collection.
Defaults to `5 * 60 * 1000` (5 minutes), or `Infinity` during SSR.
Note: the maximum allowed time is about 24 days, imposed by `setTimeout`'s 32-bit signed integer delay — see
`timeoutManager.setTimeoutProvider` for a workaround.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`gcTime`](FetchQueryOptions.md#gctime)
***
### ~~initialData?~~
```ts
optional initialData:
| TData
| InitialDataFunction<TData>;
```
Defined in: [packages/query-core/src/types.ts:317](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L317)
If set, this value will be used as the initial data for the query cache (as long as the query hasn't been
created or cached yet).
If set to a function, the function will be called **once** during the shared/root query initialization, and be
expected to synchronously return the initial data.
Initial data is considered stale by default unless a `staleTime` has been set.
`initialData` **is persisted** to the cache.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`initialData`](FetchQueryOptions.md#initialdata)
***
### ~~initialDataUpdatedAt?~~
```ts
optional initialDataUpdatedAt: number | () => number | undefined;
```
Defined in: [packages/query-core/src/types.ts:321](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L321)
If set, this value will be used as the time (in milliseconds) of when the `initialData` itself was last updated.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`initialDataUpdatedAt`](FetchQueryOptions.md#initialdataupdatedat)
***
### ~~initialPageParam?~~
```ts
optional initialPageParam: undefined;
```
Defined in: [packages/query-core/src/types.ts:605](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L605)
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`initialPageParam`](FetchQueryOptions.md#initialpageparam)
***
### ~~maxPages?~~
```ts
optional maxPages: number;
```
Defined in: [packages/query-core/src/types.ts:345](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L345)
Maximum number of pages to store in the data of an infinite query.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`maxPages`](FetchQueryOptions.md#maxpages)
***
### ~~meta?~~
```ts
optional meta: Record<string, unknown>;
```
Defined in: [packages/query-core/src/types.ts:341](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L341)
Additional payload to be stored on each query.
Use this property to pass information that can be used in other places.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`meta`](FetchQueryOptions.md#meta)
***
### ~~networkMode?~~
```ts
optional networkMode: NetworkMode;
```
Defined in: [packages/query-core/src/types.ts:265](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L265)
Controls whether a query is allowed to run based on the current network connectivity.
Defaults to `'online'`.
#### See
[Network Mode](https://tanstack.com/query/latest/docs/framework/react/guides/network-mode) for more information.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`networkMode`](FetchQueryOptions.md#networkmode)
***
### ~~persister?~~
```ts
optional persister: QueryPersister<TQueryFnData, NoInfer<TQueryKey>, TPageParam>;
```
Defined in: [packages/query-core/src/types.ts:290](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L290)
This option can be used to persist the result of a query to an external storage, bypassing the need to actually
call the `queryFn`. Useful for persisting a query's data across e.g. server/client boundaries.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`persister`](FetchQueryOptions.md#persister)
***
### ~~queryFn?~~
```ts
optional queryFn:
| typeof skipToken
| QueryFunction<TQueryFnData, TQueryKey, TPageParam>;
```
Defined in: [packages/query-core/src/types.ts:285](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L285)
The function that the query will use to request data.
Required, unless a default query function has been set via `queryClient.setQueryDefaults` or
`queryClient.setDefaultOptions`.
Receives a [QueryFunctionContext](../type-aliases/QueryFunctionContext.md).
Must return a promise that will either resolve data or throw an error. The data cannot be `undefined`.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`queryFn`](FetchQueryOptions.md#queryfn)
***
### ~~queryHash?~~
```ts
optional queryHash: string;
```
Defined in: [packages/query-core/src/types.ts:295](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L295)
The hashed form of `queryKey`, computed with `queryKeyHashFn` (or the default hashing function otherwise). Used
as the actual cache key internally.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`queryHash`](FetchQueryOptions.md#queryhash)
***
### ~~queryKey~~
```ts
queryKey: TQueryKey & object;
```
Defined in: [packages/query-core/src/types.ts:304](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L304)
The query key to use for this query.
The query key will be hashed into a stable hash. See [Query Keys](https://tanstack.com/query/latest/docs/framework/react/guides/query-keys)
for more information.
The query will automatically update when this key changes (as long as `enabled` is not set to `false`).
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`queryKey`](FetchQueryOptions.md#querykey)
***
### ~~queryKeyHashFn?~~
```ts
optional queryKeyHashFn: QueryKeyHashFunction<TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:308](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L308)
If specified, this function is used to hash the `queryKey` to a string.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`queryKeyHashFn`](FetchQueryOptions.md#querykeyhashfn)
***
### ~~retry?~~
```ts
optional retry: RetryValue<TError>;
```
Defined in: [packages/query-core/src/types.ts:246](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L246)
If `false`, failed queries will not retry by default.
If `true`, failed queries will retry infinitely.
If set to an integer number, e.g. 3, failed queries will retry until the failed query count meets that number.
If set to a function `(failureCount, error) => boolean` failed queries will retry until the function returns false.
Defaults to `3` on the client and `0` on the server.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`retry`](FetchQueryOptions.md#retry)
***
### ~~retryDelay?~~
```ts
optional retryDelay: RetryDelayValue<TError>;
```
Defined in: [packages/query-core/src/types.ts:258](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L258)
This function receives a `retryAttempt` integer and the actual Error and returns the delay to apply before the
next attempt in milliseconds.
A function like `attempt => Math.min(attempt > 1 ? 2 ** attempt * 1000 : 1000, 30 * 1000)` applies exponential
backoff.
A function like `attempt => attempt * 1000` applies linear backoff.
Defaults to a function that applies exponential backoff, capped at 30 seconds.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`retryDelay`](FetchQueryOptions.md#retrydelay)
***
### ~~revalidateIfStale?~~
```ts
optional revalidateIfStale: boolean;
```
Defined in: [packages/query-core/src/types.ts:627](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L627)
***
### ~~staleTime?~~
```ts
optional staleTime: StaleTimeFunction<TQueryFnData, TError, TData, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:610](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L610)
The time in milliseconds after data is considered stale.
If the data is fresh it will be returned from the cache.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`staleTime`](FetchQueryOptions.md#staletime)
***
### ~~structuralSharing?~~
```ts
optional structuralSharing: boolean | (oldData, newData) => unknown;
```
Defined in: [packages/query-core/src/types.ts:330](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L330)
Set this to `false` to disable structural sharing between query results.
Set this to a function which accepts the old and new data and returns resolved data of the same type to implement custom structural sharing logic.
Defaults to `true`.
#### Inherited from
[`FetchQueryOptions`](FetchQueryOptions.md).[`structuralSharing`](FetchQueryOptions.md#structuralsharing)

View File

@@ -0,0 +1,46 @@
---
id: FetchNextPageOptions
title: FetchNextPageOptions
---
Defined in: [packages/query-core/src/types.ts:737](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L737)
## Extends
- [`ResultOptions`](ResultOptions.md)
## Properties
### cancelRefetch?
```ts
optional cancelRefetch: boolean;
```
Defined in: [packages/query-core/src/types.ts:746](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L746)
If set to `true`, calling `fetchNextPage` repeatedly will invoke `queryFn` every time,
whether the previous invocation has resolved or not. Also, the result from previous invocations will be ignored.
If set to `false`, calling `fetchNextPage` repeatedly won't have any effect until the first invocation has resolved.
Defaults to `true`.
***
### throwOnError?
```ts
optional throwOnError: boolean;
```
Defined in: [packages/query-core/src/types.ts:701](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L701)
If set to `true`, the method throws if any of the underlying query refetch tasks fail.
Defaults to `false`, in which case failed refetches are swallowed and not surfaced to the
caller.
#### Inherited from
[`ResultOptions`](ResultOptions.md).[`throwOnError`](ResultOptions.md#throwonerror)

View File

@@ -0,0 +1,46 @@
---
id: FetchPreviousPageOptions
title: FetchPreviousPageOptions
---
Defined in: [packages/query-core/src/types.ts:749](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L749)
## Extends
- [`ResultOptions`](ResultOptions.md)
## Properties
### cancelRefetch?
```ts
optional cancelRefetch: boolean;
```
Defined in: [packages/query-core/src/types.ts:758](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L758)
If set to `true`, calling `fetchPreviousPage` repeatedly will invoke `queryFn` every time,
whether the previous invocation has resolved or not. Also, the result from previous invocations will be ignored.
If set to `false`, calling `fetchPreviousPage` repeatedly won't have any effect until the first invocation has resolved.
Defaults to `true`.
***
### throwOnError?
```ts
optional throwOnError: boolean;
```
Defined in: [packages/query-core/src/types.ts:701](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L701)
If set to `true`, the method throws if any of the underlying query refetch tasks fail.
Defaults to `false`, in which case failed refetches are swallowed and not surfaced to the
caller.
#### Inherited from
[`ResultOptions`](ResultOptions.md).[`throwOnError`](ResultOptions.md#throwonerror)

View File

@@ -0,0 +1,364 @@
---
id: FetchQueryOptions
title: FetchQueryOptions
---
Defined in: [packages/query-core/src/types.ts:595](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L595)
## Deprecated
## Extends
- [`WithRequired`](../type-aliases/WithRequired.md)\<`QueryOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>, `"queryKey"`\>
## Extended by
- [`EnsureQueryDataOptions`](EnsureQueryDataOptions.md)
## Type Parameters
### TQueryFnData
`TQueryFnData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
### TData
`TData` = `TQueryFnData`
### TQueryKey
`TQueryKey` *extends* [`QueryKey`](../type-aliases/QueryKey.md) = [`QueryKey`](../type-aliases/QueryKey.md)
### TPageParam
`TPageParam` = `never`
## Properties
### ~~gcTime?~~
```ts
optional gcTime: number;
```
Defined in: [packages/query-core/src/types.ts:277](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L277)
The time in milliseconds that unused/inactive cache data remains in memory.
When a query's cache becomes unused or inactive, that cache data will be garbage collected after this duration.
When different garbage collection times are specified, the longest one will be used.
Setting it to `Infinity` will disable garbage collection.
Defaults to `5 * 60 * 1000` (5 minutes), or `Infinity` during SSR.
Note: the maximum allowed time is about 24 days, imposed by `setTimeout`'s 32-bit signed integer delay — see
`timeoutManager.setTimeoutProvider` for a workaround.
#### Inherited from
```ts
WithRequired.gcTime
```
***
### ~~initialData?~~
```ts
optional initialData:
| TData
| InitialDataFunction<TData>;
```
Defined in: [packages/query-core/src/types.ts:317](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L317)
If set, this value will be used as the initial data for the query cache (as long as the query hasn't been
created or cached yet).
If set to a function, the function will be called **once** during the shared/root query initialization, and be
expected to synchronously return the initial data.
Initial data is considered stale by default unless a `staleTime` has been set.
`initialData` **is persisted** to the cache.
#### Inherited from
```ts
WithRequired.initialData
```
***
### ~~initialDataUpdatedAt?~~
```ts
optional initialDataUpdatedAt: number | () => number | undefined;
```
Defined in: [packages/query-core/src/types.ts:321](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L321)
If set, this value will be used as the time (in milliseconds) of when the `initialData` itself was last updated.
#### Inherited from
```ts
WithRequired.initialDataUpdatedAt
```
***
### ~~initialPageParam?~~
```ts
optional initialPageParam: undefined;
```
Defined in: [packages/query-core/src/types.ts:605](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L605)
***
### ~~maxPages?~~
```ts
optional maxPages: number;
```
Defined in: [packages/query-core/src/types.ts:345](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L345)
Maximum number of pages to store in the data of an infinite query.
#### Inherited from
```ts
WithRequired.maxPages
```
***
### ~~meta?~~
```ts
optional meta: Record<string, unknown>;
```
Defined in: [packages/query-core/src/types.ts:341](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L341)
Additional payload to be stored on each query.
Use this property to pass information that can be used in other places.
#### Inherited from
```ts
WithRequired.meta
```
***
### ~~networkMode?~~
```ts
optional networkMode: NetworkMode;
```
Defined in: [packages/query-core/src/types.ts:265](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L265)
Controls whether a query is allowed to run based on the current network connectivity.
Defaults to `'online'`.
#### See
[Network Mode](https://tanstack.com/query/latest/docs/framework/react/guides/network-mode) for more information.
#### Inherited from
```ts
WithRequired.networkMode
```
***
### ~~persister?~~
```ts
optional persister: QueryPersister<TQueryFnData, NoInfer<TQueryKey>, TPageParam>;
```
Defined in: [packages/query-core/src/types.ts:290](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L290)
This option can be used to persist the result of a query to an external storage, bypassing the need to actually
call the `queryFn`. Useful for persisting a query's data across e.g. server/client boundaries.
#### Inherited from
```ts
WithRequired.persister
```
***
### ~~queryFn?~~
```ts
optional queryFn:
| typeof skipToken
| QueryFunction<TQueryFnData, TQueryKey, TPageParam>;
```
Defined in: [packages/query-core/src/types.ts:285](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L285)
The function that the query will use to request data.
Required, unless a default query function has been set via `queryClient.setQueryDefaults` or
`queryClient.setDefaultOptions`.
Receives a [QueryFunctionContext](../type-aliases/QueryFunctionContext.md).
Must return a promise that will either resolve data or throw an error. The data cannot be `undefined`.
#### Inherited from
```ts
WithRequired.queryFn
```
***
### ~~queryHash?~~
```ts
optional queryHash: string;
```
Defined in: [packages/query-core/src/types.ts:295](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L295)
The hashed form of `queryKey`, computed with `queryKeyHashFn` (or the default hashing function otherwise). Used
as the actual cache key internally.
#### Inherited from
```ts
WithRequired.queryHash
```
***
### ~~queryKey~~
```ts
queryKey: TQueryKey & object;
```
Defined in: [packages/query-core/src/types.ts:304](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L304)
The query key to use for this query.
The query key will be hashed into a stable hash. See [Query Keys](https://tanstack.com/query/latest/docs/framework/react/guides/query-keys)
for more information.
The query will automatically update when this key changes (as long as `enabled` is not set to `false`).
#### Inherited from
```ts
WithRequired.queryKey
```
***
### ~~queryKeyHashFn?~~
```ts
optional queryKeyHashFn: QueryKeyHashFunction<TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:308](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L308)
If specified, this function is used to hash the `queryKey` to a string.
#### Inherited from
```ts
WithRequired.queryKeyHashFn
```
***
### ~~retry?~~
```ts
optional retry: RetryValue<TError>;
```
Defined in: [packages/query-core/src/types.ts:246](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L246)
If `false`, failed queries will not retry by default.
If `true`, failed queries will retry infinitely.
If set to an integer number, e.g. 3, failed queries will retry until the failed query count meets that number.
If set to a function `(failureCount, error) => boolean` failed queries will retry until the function returns false.
Defaults to `3` on the client and `0` on the server.
#### Inherited from
```ts
WithRequired.retry
```
***
### ~~retryDelay?~~
```ts
optional retryDelay: RetryDelayValue<TError>;
```
Defined in: [packages/query-core/src/types.ts:258](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L258)
This function receives a `retryAttempt` integer and the actual Error and returns the delay to apply before the
next attempt in milliseconds.
A function like `attempt => Math.min(attempt > 1 ? 2 ** attempt * 1000 : 1000, 30 * 1000)` applies exponential
backoff.
A function like `attempt => attempt * 1000` applies linear backoff.
Defaults to a function that applies exponential backoff, capped at 30 seconds.
#### Inherited from
```ts
WithRequired.retryDelay
```
***
### ~~staleTime?~~
```ts
optional staleTime: StaleTimeFunction<TQueryFnData, TError, TData, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:610](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L610)
The time in milliseconds after data is considered stale.
If the data is fresh it will be returned from the cache.
***
### ~~structuralSharing?~~
```ts
optional structuralSharing: boolean | (oldData, newData) => unknown;
```
Defined in: [packages/query-core/src/types.ts:330](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L330)
Set this to `false` to disable structural sharing between query results.
Set this to a function which accepts the old and new data and returns resolved data of the same type to implement custom structural sharing logic.
Defaults to `true`.
#### Inherited from
```ts
WithRequired.structuralSharing
```

View File

@@ -0,0 +1,237 @@
---
id: FocusManager
title: FocusManager
---
Defined in: [packages/query-core/src/focusManager.ts:14](https://github.com/TanStack/query/blob/main/packages/query-core/src/focusManager.ts#L14)
The `FocusManager` manages the focus state within TanStack Query.
It can be used to change the default event listeners or to manually change the focus state.
## Extends
- `Subscribable`\<`Listener`\>
## Properties
### listeners
```ts
protected listeners: Set<Listener>;
```
Defined in: [packages/query-core/src/subscribable.ts:2](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L2)
#### Inherited from
```ts
Subscribable.listeners
```
## Methods
### hasListeners()
```ts
hasListeners(): boolean;
```
Defined in: [packages/query-core/src/subscribable.ts:19](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L19)
#### Returns
`boolean`
#### Inherited from
```ts
Subscribable.hasListeners
```
***
### isFocused()
```ts
isFocused(): boolean;
```
Defined in: [packages/query-core/src/focusManager.ts:128](https://github.com/TanStack/query/blob/main/packages/query-core/src/focusManager.ts#L128)
`isFocused` can be used to get the current focus state.
#### Returns
`boolean`
***
### onFocus()
```ts
onFocus(): void;
```
Defined in: [packages/query-core/src/focusManager.ts:118](https://github.com/TanStack/query/blob/main/packages/query-core/src/focusManager.ts#L118)
`onFocus` notifies all subscribed listeners with the current focus state.
#### Returns
`void`
***
### onSubscribe()
```ts
protected onSubscribe(): void;
```
Defined in: [packages/query-core/src/focusManager.ts:39](https://github.com/TanStack/query/blob/main/packages/query-core/src/focusManager.ts#L39)
#### Returns
`void`
#### Overrides
```ts
Subscribable.onSubscribe
```
***
### onUnsubscribe()
```ts
protected onUnsubscribe(): void;
```
Defined in: [packages/query-core/src/focusManager.ts:45](https://github.com/TanStack/query/blob/main/packages/query-core/src/focusManager.ts#L45)
#### Returns
`void`
#### Overrides
```ts
Subscribable.onUnsubscribe
```
***
### setEventListener()
```ts
setEventListener(setup): void;
```
Defined in: [packages/query-core/src/focusManager.ts:77](https://github.com/TanStack/query/blob/main/packages/query-core/src/focusManager.ts#L77)
`setEventListener` can be used to set a custom event listener that will
be used to determine the focus state. The provided `setup` function
receives a `setFocused` callback: call it with a `boolean` to manually
set the focus state, or with no arguments to re-evaluate the current
focus state and notify subscribers.
#### Parameters
##### setup
`SetupFn`
#### Returns
`void`
#### Example
```ts
import { focusManager } from '@tanstack/query-core'
focusManager.setEventListener((handleFocus) => {
const listener = () => handleFocus()
// Listen to visibilitychange
if (typeof window !== 'undefined' && window.addEventListener) {
window.addEventListener('visibilitychange', listener, false)
}
return () => {
// Be sure to unsubscribe if a new handler is set
window.removeEventListener('visibilitychange', listener)
}
})
```
***
### setFocused()
```ts
setFocused(focused?): void;
```
Defined in: [packages/query-core/src/focusManager.ts:107](https://github.com/TanStack/query/blob/main/packages/query-core/src/focusManager.ts#L107)
`setFocused` can be used to manually set the focus state. Set `undefined`
to fall back to the default focus check.
#### Parameters
##### focused?
`boolean`
#### Returns
`void`
#### Example
```ts
import { focusManager } from '@tanstack/query-core'
// Set focused
focusManager.setFocused(true)
// Set unfocused
focusManager.setFocused(false)
// Fallback to the default focus check
focusManager.setFocused(undefined)
```
***
### subscribe()
```ts
subscribe(listener): () => void;
```
Defined in: [packages/query-core/src/subscribable.ts:8](https://github.com/TanStack/query/blob/main/packages/query-core/src/subscribable.ts#L8)
#### Parameters
##### listener
`Listener`
#### Returns
```ts
(): void;
```
##### Returns
`void`
#### Inherited from
```ts
Subscribable.subscribe
```

View File

@@ -0,0 +1,43 @@
---
id: HydrateOptions
title: HydrateOptions
---
Defined in: [packages/query-core/src/hydration.ts:61](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L61)
Options for `hydrate`, controlling the default options applied to queries/mutations restored from a
`DehydratedState`, and how to reverse any transformation applied by `DehydrateOptions.serializeData`.
## Properties
### defaultOptions?
```ts
optional defaultOptions: object;
```
Defined in: [packages/query-core/src/hydration.ts:62](https://github.com/TanStack/query/blob/main/packages/query-core/src/hydration.ts#L62)
#### deserializeData?
```ts
optional deserializeData: TransformerFn;
```
Transforms a query's `data` after it is read from the dehydrated state, reversing `serializeData`.
#### mutations?
```ts
optional mutations: MutationOptions<unknown, Error, unknown, unknown>;
```
Default options merged into every mutation restored from the dehydrated state.
#### queries?
```ts
optional queries: QueryOptions<unknown, Error, unknown, readonly unknown[], never>;
```
Default options merged into every query restored from the dehydrated state.

View File

@@ -0,0 +1,36 @@
---
id: InfiniteData
title: InfiniteData
---
Defined in: [packages/query-core/src/types.ts:210](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L210)
## Type Parameters
### TData
`TData`
### TPageParam
`TPageParam` = `unknown`
## Properties
### pageParams
```ts
pageParams: TPageParam[];
```
Defined in: [packages/query-core/src/types.ts:212](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L212)
***
### pages
```ts
pages: TData[];
```
Defined in: [packages/query-core/src/types.ts:211](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L211)

View File

@@ -0,0 +1,577 @@
---
id: InfiniteQueryObserverBaseResult
title: InfiniteQueryObserverBaseResult
---
Defined in: [packages/query-core/src/types.ts:1001](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1001)
## Extends
- [`QueryObserverBaseResult`](QueryObserverBaseResult.md)\<`TData`, `TError`\>
## Extended by
- [`InfiniteQueryObserverPendingResult`](InfiniteQueryObserverPendingResult.md)
- [`InfiniteQueryObserverLoadingResult`](InfiniteQueryObserverLoadingResult.md)
- [`InfiniteQueryObserverLoadingErrorResult`](InfiniteQueryObserverLoadingErrorResult.md)
- [`InfiniteQueryObserverRefetchErrorResult`](InfiniteQueryObserverRefetchErrorResult.md)
- [`InfiniteQueryObserverSuccessResult`](InfiniteQueryObserverSuccessResult.md)
- [`InfiniteQueryObserverPlaceholderResult`](InfiniteQueryObserverPlaceholderResult.md)
## Type Parameters
### TData
`TData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
## Properties
### data
```ts
data: TData | undefined;
```
Defined in: [packages/query-core/src/types.ts:771](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L771)
The last successfully resolved data for the query.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`data`](QueryObserverBaseResult.md#data)
***
### dataUpdatedAt
```ts
dataUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:775](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L775)
The timestamp for when the query most recently returned the `status` as `"success"`.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`dataUpdatedAt`](QueryObserverBaseResult.md#dataupdatedat)
***
### error
```ts
error: TError | null;
```
Defined in: [packages/query-core/src/types.ts:780](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L780)
The error object for the query, if an error was thrown.
- Defaults to `null`.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`error`](QueryObserverBaseResult.md#error)
***
### errorUpdateCount
```ts
errorUpdateCount: number;
```
Defined in: [packages/query-core/src/types.ts:799](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L799)
The sum of all errors.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`errorUpdateCount`](QueryObserverBaseResult.md#errorupdatecount)
***
### errorUpdatedAt
```ts
errorUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:784](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L784)
The timestamp for when the query most recently returned the `status` as `"error"`.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`errorUpdatedAt`](QueryObserverBaseResult.md#errorupdatedat)
***
### failureCount
```ts
failureCount: number;
```
Defined in: [packages/query-core/src/types.ts:790](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L790)
The failure count for the query.
- Incremented every time the query fails.
- Reset to `0` when the query succeeds.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`failureCount`](QueryObserverBaseResult.md#failurecount)
***
### failureReason
```ts
failureReason: TError | null;
```
Defined in: [packages/query-core/src/types.ts:795](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L795)
The failure reason for the query retry.
- Reset to `null` when the query succeeds.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`failureReason`](QueryObserverBaseResult.md#failurereason)
***
### fetchNextPage()
```ts
fetchNextPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1008](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1008)
This function allows you to fetch the next "page" of results.
#### Parameters
##### options?
[`FetchNextPageOptions`](FetchNextPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
***
### fetchPreviousPage()
```ts
fetchPreviousPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1014](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1014)
This function allows you to fetch the previous "page" of results.
#### Parameters
##### options?
[`FetchPreviousPageOptions`](FetchPreviousPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
***
### fetchStatus
```ts
fetchStatus: FetchStatus;
```
Defined in: [packages/query-core/src/types.ts:889](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L889)
The fetch status of the query.
- `fetching`: Is `true` whenever the queryFn is executing, which includes initial `pending` as well as background refetch.
- `paused`: The query wanted to fetch, but has been `paused`.
- `idle`: The query is not fetching.
- See [Network Mode](https://tanstack.com/query/latest/docs/framework/react/guides/network-mode) for more information.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`fetchStatus`](QueryObserverBaseResult.md#fetchstatus)
***
### hasNextPage
```ts
hasNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1020](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1020)
Will be `true` if there is a next page to be fetched (known via the `getNextPageParam` option).
***
### hasPreviousPage
```ts
hasPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1024](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1024)
Will be `true` if there is a previous page to be fetched (known via the `getPreviousPageParam` option).
***
### isEnabled
```ts
isEnabled: boolean;
```
Defined in: [packages/query-core/src/types.ts:867](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L867)
`true` if this observer is enabled, `false` otherwise.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isEnabled`](QueryObserverBaseResult.md#isenabled)
***
### isError
```ts
isError: boolean;
```
Defined in: [packages/query-core/src/types.ts:804](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L804)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query attempt resulted in an error.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isError`](QueryObserverBaseResult.md#iserror)
***
### isFetched
```ts
isFetched: boolean;
```
Defined in: [packages/query-core/src/types.ts:808](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L808)
Will be `true` if the query has been fetched.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isFetched`](QueryObserverBaseResult.md#isfetched)
***
### isFetchedAfterMount
```ts
isFetchedAfterMount: boolean;
```
Defined in: [packages/query-core/src/types.ts:813](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L813)
Will be `true` if the query has been fetched after the component mounted.
- This property can be used to not show any previously cached data.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isFetchedAfterMount`](QueryObserverBaseResult.md#isfetchedaftermount)
***
### isFetching
```ts
isFetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:818](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L818)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- `true` whenever the `queryFn` is executing, which includes initial `pending` as well as background refetch.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isFetching`](QueryObserverBaseResult.md#isfetching)
***
### isFetchingNextPage
```ts
isFetchingNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1032](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1032)
Will be `true` while fetching the next page with `fetchNextPage`.
***
### isFetchingPreviousPage
```ts
isFetchingPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1040](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1040)
Will be `true` while fetching the previous page with `fetchPreviousPage`.
***
### isFetchNextPageError
```ts
isFetchNextPageError: boolean;
```
Defined in: [packages/query-core/src/types.ts:1028](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1028)
Will be `true` if the query failed while fetching the next page.
***
### isFetchPreviousPageError
```ts
isFetchPreviousPageError: boolean;
```
Defined in: [packages/query-core/src/types.ts:1036](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1036)
Will be `true` if the query failed while fetching the previous page.
***
### ~~isInitialLoading~~
```ts
isInitialLoading: boolean;
```
Defined in: [packages/query-core/src/types.ts:836](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L836)
#### Deprecated
`isInitialLoading` is being deprecated in favor of `isLoading`
and will be removed in the next major version.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isInitialLoading`](QueryObserverBaseResult.md#isinitialloading)
***
### isLoading
```ts
isLoading: boolean;
```
Defined in: [packages/query-core/src/types.ts:823](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L823)
Is `true` whenever the first fetch for a query is in-flight.
- Is the same as `isFetching && isPending`.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isLoading`](QueryObserverBaseResult.md#isloading)
***
### isLoadingError
```ts
isLoadingError: boolean;
```
Defined in: [packages/query-core/src/types.ts:831](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L831)
Will be `true` if the query failed while fetching for the first time.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isLoadingError`](QueryObserverBaseResult.md#isloadingerror)
***
### isPaused
```ts
isPaused: boolean;
```
Defined in: [packages/query-core/src/types.ts:841](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L841)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- The query wanted to fetch, but has been `paused`.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isPaused`](QueryObserverBaseResult.md#ispaused)
***
### isPending
```ts
isPending: boolean;
```
Defined in: [packages/query-core/src/types.ts:827](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L827)
Will be `pending` if there's no cached data and no query attempt was finished yet.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isPending`](QueryObserverBaseResult.md#ispending)
***
### isPlaceholderData
```ts
isPlaceholderData: boolean;
```
Defined in: [packages/query-core/src/types.ts:845](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L845)
Will be `true` if the data shown is the placeholder data.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isPlaceholderData`](QueryObserverBaseResult.md#isplaceholderdata)
***
### isRefetchError
```ts
isRefetchError: boolean;
```
Defined in: [packages/query-core/src/types.ts:849](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L849)
Will be `true` if the query failed while refetching.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isRefetchError`](QueryObserverBaseResult.md#isrefetcherror)
***
### isRefetching
```ts
isRefetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:854](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L854)
Is `true` whenever a background refetch is in-flight, which _does not_ include initial `pending`.
- Is the same as `isFetching && !isPending`.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isRefetching`](QueryObserverBaseResult.md#isrefetching)
***
### isStale
```ts
isStale: boolean;
```
Defined in: [packages/query-core/src/types.ts:858](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L858)
Will be `true` if the data in the cache is invalidated or if the data is older than the given `staleTime`.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isStale`](QueryObserverBaseResult.md#isstale)
***
### isSuccess
```ts
isSuccess: boolean;
```
Defined in: [packages/query-core/src/types.ts:863](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L863)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query has received a response with no errors and is ready to display its data.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`isSuccess`](QueryObserverBaseResult.md#issuccess)
***
### refetch()
```ts
refetch: (options?) => Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:871](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L871)
A function to manually refetch the query.
#### Parameters
##### options?
[`RefetchOptions`](RefetchOptions.md)
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`refetch`](QueryObserverBaseResult.md#refetch)
***
### status
```ts
status: QueryStatus;
```
Defined in: [packages/query-core/src/types.ts:881](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L881)
The status of the query.
- Will be:
- `pending` if there's no cached data and no query attempt was finished yet.
- `error` if the query attempt resulted in an error.
- `success` if the query has received a response with no errors and is ready to display its data.
#### Inherited from
[`QueryObserverBaseResult`](QueryObserverBaseResult.md).[`status`](QueryObserverBaseResult.md#status)

View File

@@ -0,0 +1,600 @@
---
id: InfiniteQueryObserverLoadingErrorResult
title: InfiniteQueryObserverLoadingErrorResult
---
Defined in: [packages/query-core/src/types.ts:1078](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1078)
## Extends
- [`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md)\<`TData`, `TError`\>
## Type Parameters
### TData
`TData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
## Properties
### data
```ts
data: undefined;
```
Defined in: [packages/query-core/src/types.ts:1082](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1082)
The last successfully resolved data for the query.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`data`](InfiniteQueryObserverBaseResult.md#data)
***
### dataUpdatedAt
```ts
dataUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:775](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L775)
The timestamp for when the query most recently returned the `status` as `"success"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`dataUpdatedAt`](InfiniteQueryObserverBaseResult.md#dataupdatedat)
***
### error
```ts
error: TError;
```
Defined in: [packages/query-core/src/types.ts:1083](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1083)
The error object for the query, if an error was thrown.
- Defaults to `null`.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`error`](InfiniteQueryObserverBaseResult.md#error)
***
### errorUpdateCount
```ts
errorUpdateCount: number;
```
Defined in: [packages/query-core/src/types.ts:799](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L799)
The sum of all errors.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdateCount`](InfiniteQueryObserverBaseResult.md#errorupdatecount)
***
### errorUpdatedAt
```ts
errorUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:784](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L784)
The timestamp for when the query most recently returned the `status` as `"error"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdatedAt`](InfiniteQueryObserverBaseResult.md#errorupdatedat)
***
### failureCount
```ts
failureCount: number;
```
Defined in: [packages/query-core/src/types.ts:790](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L790)
The failure count for the query.
- Incremented every time the query fails.
- Reset to `0` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureCount`](InfiniteQueryObserverBaseResult.md#failurecount)
***
### failureReason
```ts
failureReason: TError | null;
```
Defined in: [packages/query-core/src/types.ts:795](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L795)
The failure reason for the query retry.
- Reset to `null` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureReason`](InfiniteQueryObserverBaseResult.md#failurereason)
***
### fetchNextPage()
```ts
fetchNextPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1008](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1008)
This function allows you to fetch the next "page" of results.
#### Parameters
##### options?
[`FetchNextPageOptions`](FetchNextPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchNextPage`](InfiniteQueryObserverBaseResult.md#fetchnextpage)
***
### fetchPreviousPage()
```ts
fetchPreviousPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1014](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1014)
This function allows you to fetch the previous "page" of results.
#### Parameters
##### options?
[`FetchPreviousPageOptions`](FetchPreviousPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchPreviousPage`](InfiniteQueryObserverBaseResult.md#fetchpreviouspage)
***
### fetchStatus
```ts
fetchStatus: FetchStatus;
```
Defined in: [packages/query-core/src/types.ts:889](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L889)
The fetch status of the query.
- `fetching`: Is `true` whenever the queryFn is executing, which includes initial `pending` as well as background refetch.
- `paused`: The query wanted to fetch, but has been `paused`.
- `idle`: The query is not fetching.
- See [Network Mode](https://tanstack.com/query/latest/docs/framework/react/guides/network-mode) for more information.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchStatus`](InfiniteQueryObserverBaseResult.md#fetchstatus)
***
### hasNextPage
```ts
hasNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1020](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1020)
Will be `true` if there is a next page to be fetched (known via the `getNextPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasNextPage`](InfiniteQueryObserverBaseResult.md#hasnextpage)
***
### hasPreviousPage
```ts
hasPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1024](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1024)
Will be `true` if there is a previous page to be fetched (known via the `getPreviousPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasPreviousPage`](InfiniteQueryObserverBaseResult.md#haspreviouspage)
***
### isEnabled
```ts
isEnabled: boolean;
```
Defined in: [packages/query-core/src/types.ts:867](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L867)
`true` if this observer is enabled, `false` otherwise.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isEnabled`](InfiniteQueryObserverBaseResult.md#isenabled)
***
### isError
```ts
isError: true;
```
Defined in: [packages/query-core/src/types.ts:1084](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1084)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query attempt resulted in an error.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isError`](InfiniteQueryObserverBaseResult.md#iserror)
***
### isFetched
```ts
isFetched: boolean;
```
Defined in: [packages/query-core/src/types.ts:808](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L808)
Will be `true` if the query has been fetched.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetched`](InfiniteQueryObserverBaseResult.md#isfetched)
***
### isFetchedAfterMount
```ts
isFetchedAfterMount: boolean;
```
Defined in: [packages/query-core/src/types.ts:813](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L813)
Will be `true` if the query has been fetched after the component mounted.
- This property can be used to not show any previously cached data.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchedAfterMount`](InfiniteQueryObserverBaseResult.md#isfetchedaftermount)
***
### isFetching
```ts
isFetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:818](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L818)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- `true` whenever the `queryFn` is executing, which includes initial `pending` as well as background refetch.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetching`](InfiniteQueryObserverBaseResult.md#isfetching)
***
### isFetchingNextPage
```ts
isFetchingNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1032](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1032)
Will be `true` while fetching the next page with `fetchNextPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingNextPage`](InfiniteQueryObserverBaseResult.md#isfetchingnextpage)
***
### isFetchingPreviousPage
```ts
isFetchingPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1040](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1040)
Will be `true` while fetching the previous page with `fetchPreviousPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingPreviousPage`](InfiniteQueryObserverBaseResult.md#isfetchingpreviouspage)
***
### isFetchNextPageError
```ts
isFetchNextPageError: false;
```
Defined in: [packages/query-core/src/types.ts:1089](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1089)
Will be `true` if the query failed while fetching the next page.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchNextPageError`](InfiniteQueryObserverBaseResult.md#isfetchnextpageerror)
***
### isFetchPreviousPageError
```ts
isFetchPreviousPageError: false;
```
Defined in: [packages/query-core/src/types.ts:1090](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1090)
Will be `true` if the query failed while fetching the previous page.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchPreviousPageError`](InfiniteQueryObserverBaseResult.md#isfetchpreviouspageerror)
***
### ~~isInitialLoading~~
```ts
isInitialLoading: boolean;
```
Defined in: [packages/query-core/src/types.ts:836](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L836)
#### Deprecated
`isInitialLoading` is being deprecated in favor of `isLoading`
and will be removed in the next major version.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isInitialLoading`](InfiniteQueryObserverBaseResult.md#isinitialloading)
***
### isLoading
```ts
isLoading: false;
```
Defined in: [packages/query-core/src/types.ts:1086](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1086)
Is `true` whenever the first fetch for a query is in-flight.
- Is the same as `isFetching && isPending`.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoading`](InfiniteQueryObserverBaseResult.md#isloading)
***
### isLoadingError
```ts
isLoadingError: true;
```
Defined in: [packages/query-core/src/types.ts:1087](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1087)
Will be `true` if the query failed while fetching for the first time.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoadingError`](InfiniteQueryObserverBaseResult.md#isloadingerror)
***
### isPaused
```ts
isPaused: boolean;
```
Defined in: [packages/query-core/src/types.ts:841](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L841)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- The query wanted to fetch, but has been `paused`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPaused`](InfiniteQueryObserverBaseResult.md#ispaused)
***
### isPending
```ts
isPending: false;
```
Defined in: [packages/query-core/src/types.ts:1085](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1085)
Will be `pending` if there's no cached data and no query attempt was finished yet.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPending`](InfiniteQueryObserverBaseResult.md#ispending)
***
### isPlaceholderData
```ts
isPlaceholderData: false;
```
Defined in: [packages/query-core/src/types.ts:1092](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1092)
Will be `true` if the data shown is the placeholder data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPlaceholderData`](InfiniteQueryObserverBaseResult.md#isplaceholderdata)
***
### isRefetchError
```ts
isRefetchError: false;
```
Defined in: [packages/query-core/src/types.ts:1088](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1088)
Will be `true` if the query failed while refetching.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetchError`](InfiniteQueryObserverBaseResult.md#isrefetcherror)
***
### isRefetching
```ts
isRefetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:854](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L854)
Is `true` whenever a background refetch is in-flight, which _does not_ include initial `pending`.
- Is the same as `isFetching && !isPending`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetching`](InfiniteQueryObserverBaseResult.md#isrefetching)
***
### isStale
```ts
isStale: boolean;
```
Defined in: [packages/query-core/src/types.ts:858](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L858)
Will be `true` if the data in the cache is invalidated or if the data is older than the given `staleTime`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isStale`](InfiniteQueryObserverBaseResult.md#isstale)
***
### isSuccess
```ts
isSuccess: false;
```
Defined in: [packages/query-core/src/types.ts:1091](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1091)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isSuccess`](InfiniteQueryObserverBaseResult.md#issuccess)
***
### refetch()
```ts
refetch: (options?) => Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:871](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L871)
A function to manually refetch the query.
#### Parameters
##### options?
[`RefetchOptions`](RefetchOptions.md)
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`refetch`](InfiniteQueryObserverBaseResult.md#refetch)
***
### status
```ts
status: "error";
```
Defined in: [packages/query-core/src/types.ts:1093](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1093)
The status of the query.
- Will be:
- `pending` if there's no cached data and no query attempt was finished yet.
- `error` if the query attempt resulted in an error.
- `success` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`status`](InfiniteQueryObserverBaseResult.md#status)

View File

@@ -0,0 +1,600 @@
---
id: InfiniteQueryObserverLoadingResult
title: InfiniteQueryObserverLoadingResult
---
Defined in: [packages/query-core/src/types.ts:1060](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1060)
## Extends
- [`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md)\<`TData`, `TError`\>
## Type Parameters
### TData
`TData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
## Properties
### data
```ts
data: undefined;
```
Defined in: [packages/query-core/src/types.ts:1064](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1064)
The last successfully resolved data for the query.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`data`](InfiniteQueryObserverBaseResult.md#data)
***
### dataUpdatedAt
```ts
dataUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:775](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L775)
The timestamp for when the query most recently returned the `status` as `"success"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`dataUpdatedAt`](InfiniteQueryObserverBaseResult.md#dataupdatedat)
***
### error
```ts
error: null;
```
Defined in: [packages/query-core/src/types.ts:1065](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1065)
The error object for the query, if an error was thrown.
- Defaults to `null`.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`error`](InfiniteQueryObserverBaseResult.md#error)
***
### errorUpdateCount
```ts
errorUpdateCount: number;
```
Defined in: [packages/query-core/src/types.ts:799](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L799)
The sum of all errors.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdateCount`](InfiniteQueryObserverBaseResult.md#errorupdatecount)
***
### errorUpdatedAt
```ts
errorUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:784](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L784)
The timestamp for when the query most recently returned the `status` as `"error"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdatedAt`](InfiniteQueryObserverBaseResult.md#errorupdatedat)
***
### failureCount
```ts
failureCount: number;
```
Defined in: [packages/query-core/src/types.ts:790](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L790)
The failure count for the query.
- Incremented every time the query fails.
- Reset to `0` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureCount`](InfiniteQueryObserverBaseResult.md#failurecount)
***
### failureReason
```ts
failureReason: TError | null;
```
Defined in: [packages/query-core/src/types.ts:795](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L795)
The failure reason for the query retry.
- Reset to `null` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureReason`](InfiniteQueryObserverBaseResult.md#failurereason)
***
### fetchNextPage()
```ts
fetchNextPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1008](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1008)
This function allows you to fetch the next "page" of results.
#### Parameters
##### options?
[`FetchNextPageOptions`](FetchNextPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchNextPage`](InfiniteQueryObserverBaseResult.md#fetchnextpage)
***
### fetchPreviousPage()
```ts
fetchPreviousPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1014](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1014)
This function allows you to fetch the previous "page" of results.
#### Parameters
##### options?
[`FetchPreviousPageOptions`](FetchPreviousPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchPreviousPage`](InfiniteQueryObserverBaseResult.md#fetchpreviouspage)
***
### fetchStatus
```ts
fetchStatus: FetchStatus;
```
Defined in: [packages/query-core/src/types.ts:889](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L889)
The fetch status of the query.
- `fetching`: Is `true` whenever the queryFn is executing, which includes initial `pending` as well as background refetch.
- `paused`: The query wanted to fetch, but has been `paused`.
- `idle`: The query is not fetching.
- See [Network Mode](https://tanstack.com/query/latest/docs/framework/react/guides/network-mode) for more information.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchStatus`](InfiniteQueryObserverBaseResult.md#fetchstatus)
***
### hasNextPage
```ts
hasNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1020](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1020)
Will be `true` if there is a next page to be fetched (known via the `getNextPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasNextPage`](InfiniteQueryObserverBaseResult.md#hasnextpage)
***
### hasPreviousPage
```ts
hasPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1024](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1024)
Will be `true` if there is a previous page to be fetched (known via the `getPreviousPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasPreviousPage`](InfiniteQueryObserverBaseResult.md#haspreviouspage)
***
### isEnabled
```ts
isEnabled: boolean;
```
Defined in: [packages/query-core/src/types.ts:867](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L867)
`true` if this observer is enabled, `false` otherwise.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isEnabled`](InfiniteQueryObserverBaseResult.md#isenabled)
***
### isError
```ts
isError: false;
```
Defined in: [packages/query-core/src/types.ts:1066](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1066)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query attempt resulted in an error.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isError`](InfiniteQueryObserverBaseResult.md#iserror)
***
### isFetched
```ts
isFetched: boolean;
```
Defined in: [packages/query-core/src/types.ts:808](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L808)
Will be `true` if the query has been fetched.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetched`](InfiniteQueryObserverBaseResult.md#isfetched)
***
### isFetchedAfterMount
```ts
isFetchedAfterMount: boolean;
```
Defined in: [packages/query-core/src/types.ts:813](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L813)
Will be `true` if the query has been fetched after the component mounted.
- This property can be used to not show any previously cached data.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchedAfterMount`](InfiniteQueryObserverBaseResult.md#isfetchedaftermount)
***
### isFetching
```ts
isFetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:818](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L818)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- `true` whenever the `queryFn` is executing, which includes initial `pending` as well as background refetch.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetching`](InfiniteQueryObserverBaseResult.md#isfetching)
***
### isFetchingNextPage
```ts
isFetchingNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1032](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1032)
Will be `true` while fetching the next page with `fetchNextPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingNextPage`](InfiniteQueryObserverBaseResult.md#isfetchingnextpage)
***
### isFetchingPreviousPage
```ts
isFetchingPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1040](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1040)
Will be `true` while fetching the previous page with `fetchPreviousPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingPreviousPage`](InfiniteQueryObserverBaseResult.md#isfetchingpreviouspage)
***
### isFetchNextPageError
```ts
isFetchNextPageError: false;
```
Defined in: [packages/query-core/src/types.ts:1071](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1071)
Will be `true` if the query failed while fetching the next page.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchNextPageError`](InfiniteQueryObserverBaseResult.md#isfetchnextpageerror)
***
### isFetchPreviousPageError
```ts
isFetchPreviousPageError: false;
```
Defined in: [packages/query-core/src/types.ts:1072](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1072)
Will be `true` if the query failed while fetching the previous page.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchPreviousPageError`](InfiniteQueryObserverBaseResult.md#isfetchpreviouspageerror)
***
### ~~isInitialLoading~~
```ts
isInitialLoading: boolean;
```
Defined in: [packages/query-core/src/types.ts:836](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L836)
#### Deprecated
`isInitialLoading` is being deprecated in favor of `isLoading`
and will be removed in the next major version.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isInitialLoading`](InfiniteQueryObserverBaseResult.md#isinitialloading)
***
### isLoading
```ts
isLoading: true;
```
Defined in: [packages/query-core/src/types.ts:1068](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1068)
Is `true` whenever the first fetch for a query is in-flight.
- Is the same as `isFetching && isPending`.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoading`](InfiniteQueryObserverBaseResult.md#isloading)
***
### isLoadingError
```ts
isLoadingError: false;
```
Defined in: [packages/query-core/src/types.ts:1069](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1069)
Will be `true` if the query failed while fetching for the first time.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoadingError`](InfiniteQueryObserverBaseResult.md#isloadingerror)
***
### isPaused
```ts
isPaused: boolean;
```
Defined in: [packages/query-core/src/types.ts:841](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L841)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- The query wanted to fetch, but has been `paused`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPaused`](InfiniteQueryObserverBaseResult.md#ispaused)
***
### isPending
```ts
isPending: true;
```
Defined in: [packages/query-core/src/types.ts:1067](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1067)
Will be `pending` if there's no cached data and no query attempt was finished yet.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPending`](InfiniteQueryObserverBaseResult.md#ispending)
***
### isPlaceholderData
```ts
isPlaceholderData: false;
```
Defined in: [packages/query-core/src/types.ts:1074](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1074)
Will be `true` if the data shown is the placeholder data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPlaceholderData`](InfiniteQueryObserverBaseResult.md#isplaceholderdata)
***
### isRefetchError
```ts
isRefetchError: false;
```
Defined in: [packages/query-core/src/types.ts:1070](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1070)
Will be `true` if the query failed while refetching.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetchError`](InfiniteQueryObserverBaseResult.md#isrefetcherror)
***
### isRefetching
```ts
isRefetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:854](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L854)
Is `true` whenever a background refetch is in-flight, which _does not_ include initial `pending`.
- Is the same as `isFetching && !isPending`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetching`](InfiniteQueryObserverBaseResult.md#isrefetching)
***
### isStale
```ts
isStale: boolean;
```
Defined in: [packages/query-core/src/types.ts:858](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L858)
Will be `true` if the data in the cache is invalidated or if the data is older than the given `staleTime`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isStale`](InfiniteQueryObserverBaseResult.md#isstale)
***
### isSuccess
```ts
isSuccess: false;
```
Defined in: [packages/query-core/src/types.ts:1073](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1073)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isSuccess`](InfiniteQueryObserverBaseResult.md#issuccess)
***
### refetch()
```ts
refetch: (options?) => Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:871](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L871)
A function to manually refetch the query.
#### Parameters
##### options?
[`RefetchOptions`](RefetchOptions.md)
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`refetch`](InfiniteQueryObserverBaseResult.md#refetch)
***
### status
```ts
status: "pending";
```
Defined in: [packages/query-core/src/types.ts:1075](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1075)
The status of the query.
- Will be:
- `pending` if there's no cached data and no query attempt was finished yet.
- `error` if the query attempt resulted in an error.
- `success` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`status`](InfiniteQueryObserverBaseResult.md#status)

View File

@@ -0,0 +1,680 @@
---
id: InfiniteQueryObserverOptions
title: InfiniteQueryObserverOptions
---
Defined in: [packages/solid-query/src/QueryClient.ts:62](https://github.com/TanStack/query/blob/main/packages/solid-query/src/QueryClient.ts#L62)
The core `InfiniteQueryObserverOptions`, with Solid's `reconcile` option added.
## Extends
- [`OmitKeyof`](../type-aliases/OmitKeyof.md)\<`QueryCoreInfiniteQueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>, `"structuralSharing"`\>
## Type Parameters
### TQueryFnData
`TQueryFnData` = `unknown`
The type of a single page, as your `queryFn` resolves it.
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
The type of errors your `queryFn` may throw.
### TData
`TData` = `TQueryFnData`
The type `data` ends up as after `select` runs.
### TQueryKey
`TQueryKey` *extends* [`QueryKey`](../type-aliases/QueryKey.md) = [`QueryKey`](../type-aliases/QueryKey.md)
The type of your `queryKey`.
### TPageParam
`TPageParam` = `unknown`
The type of the parameter passed to `queryFn` to fetch a given page.
## Properties
### enabled?
```ts
optional enabled: QueryBooleanOption<TQueryFnData, TError, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:398](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L398)
Set this to `false` or a function that returns `false` to disable automatic refetching when the query mounts or changes query keys.
To refetch the query, use the `refetch` method returned from the `useQuery` instance.
Accepts a boolean or function that returns a boolean.
Defaults to `true`.
#### Inherited from
```ts
OmitKeyof.enabled
```
***
### gcTime?
```ts
optional gcTime: number;
```
Defined in: [packages/query-core/src/types.ts:277](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L277)
The time in milliseconds that unused/inactive cache data remains in memory.
When a query's cache becomes unused or inactive, that cache data will be garbage collected after this duration.
When different garbage collection times are specified, the longest one will be used.
Setting it to `Infinity` will disable garbage collection.
Defaults to `5 * 60 * 1000` (5 minutes), or `Infinity` during SSR.
Note: the maximum allowed time is about 24 days, imposed by `setTimeout`'s 32-bit signed integer delay — see
`timeoutManager.setTimeoutProvider` for a workaround.
#### Inherited from
[`QueryExecuteOptions`](QueryExecuteOptions.md).[`gcTime`](QueryExecuteOptions.md#gctime)
***
### getNextPageParam
```ts
getNextPageParam: GetNextPageParamFunction<TPageParam, TQueryFnData>;
```
Defined in: [packages/query-core/src/types.ts:365](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L365)
This function can be set to automatically get the next cursor for infinite queries.
The result will also be used to determine the value of `hasNextPage`.
#### Inherited from
```ts
OmitKeyof.getNextPageParam
```
***
### getPreviousPageParam?
```ts
optional getPreviousPageParam: GetPreviousPageParamFunction<TPageParam, TQueryFnData>;
```
Defined in: [packages/query-core/src/types.ts:360](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L360)
This function can be set to automatically get the previous cursor for infinite queries.
The result will also be used to determine the value of `hasPreviousPage`.
#### Inherited from
```ts
OmitKeyof.getPreviousPageParam
```
***
### initialData?
```ts
optional initialData:
| InfiniteData<TQueryFnData, TPageParam>
| InitialDataFunction<InfiniteData<TQueryFnData, TPageParam>>;
```
Defined in: [packages/query-core/src/types.ts:317](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L317)
If set, this value will be used as the initial data for the query cache (as long as the query hasn't been
created or cached yet).
If set to a function, the function will be called **once** during the shared/root query initialization, and be
expected to synchronously return the initial data.
Initial data is considered stale by default unless a `staleTime` has been set.
`initialData` **is persisted** to the cache.
#### Inherited from
```ts
OmitKeyof.initialData
```
***
### initialDataUpdatedAt?
```ts
optional initialDataUpdatedAt: number | () => number | undefined;
```
Defined in: [packages/query-core/src/types.ts:321](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L321)
If set, this value will be used as the time (in milliseconds) of when the `initialData` itself was last updated.
#### Inherited from
```ts
OmitKeyof.initialDataUpdatedAt
```
***
### initialPageParam
```ts
initialPageParam: TPageParam;
```
Defined in: [packages/query-core/src/types.ts:349](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L349)
#### Inherited from
```ts
OmitKeyof.initialPageParam
```
***
### maxPages?
```ts
optional maxPages: number;
```
Defined in: [packages/query-core/src/types.ts:345](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L345)
Maximum number of pages to store in the data of an infinite query.
#### Inherited from
[`QueryExecuteOptions`](QueryExecuteOptions.md).[`maxPages`](QueryExecuteOptions.md#maxpages)
***
### meta?
```ts
optional meta: Record<string, unknown>;
```
Defined in: [packages/query-core/src/types.ts:341](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L341)
Additional payload to be stored on each query.
Use this property to pass information that can be used in other places.
#### Inherited from
[`QueryExecuteOptions`](QueryExecuteOptions.md).[`meta`](QueryExecuteOptions.md#meta)
***
### networkMode?
```ts
optional networkMode: NetworkMode;
```
Defined in: [packages/query-core/src/types.ts:265](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L265)
Controls whether a query is allowed to run based on the current network connectivity.
Defaults to `'online'`.
#### See
[Network Mode](https://tanstack.com/query/latest/docs/framework/react/guides/network-mode) for more information.
#### Inherited from
[`QueryExecuteOptions`](QueryExecuteOptions.md).[`networkMode`](QueryExecuteOptions.md#networkmode)
***
### notifyOnChangeProps?
```ts
optional notifyOnChangeProps: NotifyOnChangeProps;
```
Defined in: [packages/query-core/src/types.ts:484](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L484)
If set, the component will only re-render if any of the listed properties change.
When set to `['data', 'error']`, the component will only re-render when the `data` or `error` properties change.
When set to `'all'`, the component will re-render whenever a query is updated.
When set to a function, the function will be executed to compute the list of properties.
Defaults to `undefined`, in which case property access is tracked automatically, and the
component only re-renders when one of the tracked properties changes.
#### Inherited from
```ts
OmitKeyof.notifyOnChangeProps
```
***
### persister?
```ts
optional persister: QueryPersister<TQueryFnData, NoInfer<TQueryKey>, TPageParam>;
```
Defined in: [packages/query-core/src/types.ts:290](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L290)
This option can be used to persist the result of a query to an external storage, bypassing the need to actually
call the `queryFn`. Useful for persisting a query's data across e.g. server/client boundaries.
#### Inherited from
```ts
OmitKeyof.persister
```
***
### placeholderData?
```ts
optional placeholderData:
| InfiniteData<TQueryFnData, TPageParam>
| PlaceholderDataFunction<InfiniteData<TQueryFnData, TPageParam>, TError, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:511](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L511)
If set, this value will be used as the placeholder data for this particular query observer while the query is still in the `loading` data and no initialData has been provided.
#### Inherited from
```ts
OmitKeyof.placeholderData
```
***
### queryFn?
```ts
optional queryFn:
| typeof skipToken
| QueryFunction<TQueryFnData, TQueryKey, TPageParam>;
```
Defined in: [packages/query-core/src/types.ts:285](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L285)
The function that the query will use to request data.
Required, unless a default query function has been set via `queryClient.setQueryDefaults` or
`queryClient.setDefaultOptions`.
Receives a [QueryFunctionContext](../type-aliases/QueryFunctionContext.md).
Must return a promise that will either resolve data or throw an error. The data cannot be `undefined`.
#### Inherited from
```ts
OmitKeyof.queryFn
```
***
### queryHash?
```ts
optional queryHash: string;
```
Defined in: [packages/query-core/src/types.ts:295](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L295)
The hashed form of `queryKey`, computed with `queryKeyHashFn` (or the default hashing function otherwise). Used
as the actual cache key internally.
#### Inherited from
[`QueryExecuteOptions`](QueryExecuteOptions.md).[`queryHash`](QueryExecuteOptions.md#queryhash)
***
### queryKey
```ts
queryKey: TQueryKey & object;
```
Defined in: [packages/query-core/src/types.ts:304](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L304)
The query key to use for this query.
The query key will be hashed into a stable hash. See [Query Keys](https://tanstack.com/query/latest/docs/framework/react/guides/query-keys)
for more information.
The query will automatically update when this key changes (as long as `enabled` is not set to `false`).
#### Inherited from
```ts
OmitKeyof.queryKey
```
***
### queryKeyHashFn?
```ts
optional queryKeyHashFn: QueryKeyHashFunction<TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:308](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L308)
If specified, this function is used to hash the `queryKey` to a string.
#### Inherited from
```ts
OmitKeyof.queryKeyHashFn
```
***
### reconcile?
```ts
optional reconcile: string | false | (oldData, newData) => TData;
```
Defined in: [packages/solid-query/src/QueryClient.ts:84](https://github.com/TanStack/query/blob/main/packages/solid-query/src/QueryClient.ts#L84)
Set this to a reconciliation key to enable reconciliation between query results.
Set this to `false` to disable reconciliation between query results.
Set this to a function which accepts the old and new data and returns resolved data of the same type to implement custom reconciliation logic.
Defaults reconciliation to false.
***
### refetchInterval?
```ts
optional refetchInterval: number | false | (query) => number | false | undefined;
```
Defined in: [packages/query-core/src/types.ts:414](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L414)
If set to a number, the query will continuously refetch at this frequency in milliseconds.
If set to a function, the function will be executed with the latest data and query to compute a frequency
Defaults to `false`.
#### Inherited from
```ts
OmitKeyof.refetchInterval
```
***
### refetchIntervalInBackground?
```ts
optional refetchIntervalInBackground: boolean;
```
Defined in: [packages/query-core/src/types.ts:425](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L425)
If set to `true`, the query will continue to refetch while their tab/window is in the background.
Defaults to `false`.
#### Inherited from
```ts
OmitKeyof.refetchIntervalInBackground
```
***
### refetchOnMount?
```ts
optional refetchOnMount: boolean | "always" | (query) => boolean | "always";
```
Defined in: [packages/query-core/src/types.ts:462](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L462)
If set to `true`, the query will refetch on mount if the data is stale.
If set to `false`, will disable additional instances of a query to trigger background refetch.
If set to `'always'`, the query will always refetch on mount (except when `staleTime: 'static'` is used).
If set to a function, the function will be executed with the latest data and query to compute the value
Defaults to `true`.
#### Inherited from
```ts
OmitKeyof.refetchOnMount
```
***
### refetchOnReconnect?
```ts
optional refetchOnReconnect: boolean | "always" | (query) => boolean | "always";
```
Defined in: [packages/query-core/src/types.ts:448](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L448)
If set to `true`, the query will refetch on reconnect if the data is stale.
If set to `false`, the query will not refetch on reconnect.
If set to `'always'`, the query will always refetch on reconnect (except when `staleTime: 'static'` is used).
If set to a function, the function will be executed with the latest data and query to compute the value.
Defaults to `true` unless `networkMode` is `'always'`.
#### Inherited from
```ts
OmitKeyof.refetchOnReconnect
```
***
### refetchOnWindowFocus?
```ts
optional refetchOnWindowFocus: boolean | "always" | (query) => boolean | "always";
```
Defined in: [packages/query-core/src/types.ts:434](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L434)
If set to `true`, the query will refetch on window focus if the data is stale.
If set to `false`, the query will not refetch on window focus.
If set to `'always'`, the query will always refetch on window focus (except when `staleTime: 'static'` is used).
If set to a function, the function will be executed with the latest data and query to compute the value.
Defaults to `true`.
#### Inherited from
```ts
OmitKeyof.refetchOnWindowFocus
```
***
### retry?
```ts
optional retry: RetryValue<TError>;
```
Defined in: [packages/query-core/src/types.ts:246](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L246)
If `false`, failed queries will not retry by default.
If `true`, failed queries will retry infinitely.
If set to an integer number, e.g. 3, failed queries will retry until the failed query count meets that number.
If set to a function `(failureCount, error) => boolean` failed queries will retry until the function returns false.
Defaults to `3` on the client and `0` on the server.
#### Inherited from
```ts
OmitKeyof.retry
```
***
### retryDelay?
```ts
optional retryDelay: RetryDelayValue<TError>;
```
Defined in: [packages/query-core/src/types.ts:258](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L258)
This function receives a `retryAttempt` integer and the actual Error and returns the delay to apply before the
next attempt in milliseconds.
A function like `attempt => Math.min(attempt > 1 ? 2 ** attempt * 1000 : 1000, 30 * 1000)` applies exponential
backoff.
A function like `attempt => attempt * 1000` applies linear backoff.
Defaults to a function that applies exponential backoff, capped at 30 seconds.
#### Inherited from
```ts
OmitKeyof.retryDelay
```
***
### retryOnMount?
```ts
optional retryOnMount: QueryBooleanOption<TQueryFnData, TError, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:474](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L474)
If set to `false`, the query will not be retried on mount if it contains an error.
If set to a function, the function will be executed with the query to compute the value.
Defaults to `true`.
#### Inherited from
```ts
OmitKeyof.retryOnMount
```
***
### select()?
```ts
optional select: (data) => TData;
```
Defined in: [packages/query-core/src/types.ts:500](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L500)
This option can be used to transform or select a part of the data returned by the query function. It affects
the returned `data` value, but does not affect what gets stored in the query cache.
The `select` function will only run if `data` changed, or if the reference to the `select` function itself
changes. To optimize, memoize the function so its reference stays stable across calls.
#### Parameters
##### data
[`InfiniteData`](InfiniteData.md)
#### Returns
`TData`
#### Inherited from
```ts
OmitKeyof.select
```
***
### staleTime?
```ts
optional staleTime: StaleTimeFunction<TQueryFnData, TError, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:407](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L407)
The time in milliseconds after data is considered stale.
If set to `Infinity`, the data will never be considered stale.
If set to `'static'`, the data will never be considered stale.
If set to a function, the function will be executed with the query to compute a `staleTime`.
Defaults to `0`.
#### Inherited from
```ts
OmitKeyof.staleTime
```
***
### suspense?
```ts
optional suspense: boolean;
```
Defined in: [packages/query-core/src/types.ts:507](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L507)
If set to `true`, the query will suspend when `status === 'pending'`
and throw errors when `status === 'error'`.
Defaults to `false`.
#### Inherited from
```ts
OmitKeyof.suspense
```
***
### throwOnError?
```ts
optional throwOnError: ThrowOnError<TQueryFnData, TError, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:493](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L493)
Whether errors should be thrown instead of setting the `error` property.
If set to `true` or `suspense` is `true`, all errors will be thrown to the error boundary.
If set to `false` and `suspense` is `false`, errors are returned as state.
If set to a function, it will be passed the error and the query, and it should return a boolean indicating whether to show the error in an error boundary (`true`) or return the error as state (`false`).
Defaults to `false`.
#### Inherited from
```ts
OmitKeyof.throwOnError
```

View File

@@ -0,0 +1,600 @@
---
id: InfiniteQueryObserverPendingResult
title: InfiniteQueryObserverPendingResult
---
Defined in: [packages/query-core/src/types.ts:1043](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1043)
## Extends
- [`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md)\<`TData`, `TError`\>
## Type Parameters
### TData
`TData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
## Properties
### data
```ts
data: undefined;
```
Defined in: [packages/query-core/src/types.ts:1047](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1047)
The last successfully resolved data for the query.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`data`](InfiniteQueryObserverBaseResult.md#data)
***
### dataUpdatedAt
```ts
dataUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:775](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L775)
The timestamp for when the query most recently returned the `status` as `"success"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`dataUpdatedAt`](InfiniteQueryObserverBaseResult.md#dataupdatedat)
***
### error
```ts
error: null;
```
Defined in: [packages/query-core/src/types.ts:1048](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1048)
The error object for the query, if an error was thrown.
- Defaults to `null`.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`error`](InfiniteQueryObserverBaseResult.md#error)
***
### errorUpdateCount
```ts
errorUpdateCount: number;
```
Defined in: [packages/query-core/src/types.ts:799](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L799)
The sum of all errors.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdateCount`](InfiniteQueryObserverBaseResult.md#errorupdatecount)
***
### errorUpdatedAt
```ts
errorUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:784](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L784)
The timestamp for when the query most recently returned the `status` as `"error"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdatedAt`](InfiniteQueryObserverBaseResult.md#errorupdatedat)
***
### failureCount
```ts
failureCount: number;
```
Defined in: [packages/query-core/src/types.ts:790](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L790)
The failure count for the query.
- Incremented every time the query fails.
- Reset to `0` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureCount`](InfiniteQueryObserverBaseResult.md#failurecount)
***
### failureReason
```ts
failureReason: TError | null;
```
Defined in: [packages/query-core/src/types.ts:795](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L795)
The failure reason for the query retry.
- Reset to `null` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureReason`](InfiniteQueryObserverBaseResult.md#failurereason)
***
### fetchNextPage()
```ts
fetchNextPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1008](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1008)
This function allows you to fetch the next "page" of results.
#### Parameters
##### options?
[`FetchNextPageOptions`](FetchNextPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchNextPage`](InfiniteQueryObserverBaseResult.md#fetchnextpage)
***
### fetchPreviousPage()
```ts
fetchPreviousPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1014](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1014)
This function allows you to fetch the previous "page" of results.
#### Parameters
##### options?
[`FetchPreviousPageOptions`](FetchPreviousPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchPreviousPage`](InfiniteQueryObserverBaseResult.md#fetchpreviouspage)
***
### fetchStatus
```ts
fetchStatus: FetchStatus;
```
Defined in: [packages/query-core/src/types.ts:889](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L889)
The fetch status of the query.
- `fetching`: Is `true` whenever the queryFn is executing, which includes initial `pending` as well as background refetch.
- `paused`: The query wanted to fetch, but has been `paused`.
- `idle`: The query is not fetching.
- See [Network Mode](https://tanstack.com/query/latest/docs/framework/react/guides/network-mode) for more information.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchStatus`](InfiniteQueryObserverBaseResult.md#fetchstatus)
***
### hasNextPage
```ts
hasNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1020](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1020)
Will be `true` if there is a next page to be fetched (known via the `getNextPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasNextPage`](InfiniteQueryObserverBaseResult.md#hasnextpage)
***
### hasPreviousPage
```ts
hasPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1024](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1024)
Will be `true` if there is a previous page to be fetched (known via the `getPreviousPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasPreviousPage`](InfiniteQueryObserverBaseResult.md#haspreviouspage)
***
### isEnabled
```ts
isEnabled: boolean;
```
Defined in: [packages/query-core/src/types.ts:867](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L867)
`true` if this observer is enabled, `false` otherwise.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isEnabled`](InfiniteQueryObserverBaseResult.md#isenabled)
***
### isError
```ts
isError: false;
```
Defined in: [packages/query-core/src/types.ts:1049](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1049)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query attempt resulted in an error.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isError`](InfiniteQueryObserverBaseResult.md#iserror)
***
### isFetched
```ts
isFetched: boolean;
```
Defined in: [packages/query-core/src/types.ts:808](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L808)
Will be `true` if the query has been fetched.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetched`](InfiniteQueryObserverBaseResult.md#isfetched)
***
### isFetchedAfterMount
```ts
isFetchedAfterMount: boolean;
```
Defined in: [packages/query-core/src/types.ts:813](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L813)
Will be `true` if the query has been fetched after the component mounted.
- This property can be used to not show any previously cached data.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchedAfterMount`](InfiniteQueryObserverBaseResult.md#isfetchedaftermount)
***
### isFetching
```ts
isFetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:818](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L818)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- `true` whenever the `queryFn` is executing, which includes initial `pending` as well as background refetch.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetching`](InfiniteQueryObserverBaseResult.md#isfetching)
***
### isFetchingNextPage
```ts
isFetchingNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1032](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1032)
Will be `true` while fetching the next page with `fetchNextPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingNextPage`](InfiniteQueryObserverBaseResult.md#isfetchingnextpage)
***
### isFetchingPreviousPage
```ts
isFetchingPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1040](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1040)
Will be `true` while fetching the previous page with `fetchPreviousPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingPreviousPage`](InfiniteQueryObserverBaseResult.md#isfetchingpreviouspage)
***
### isFetchNextPageError
```ts
isFetchNextPageError: false;
```
Defined in: [packages/query-core/src/types.ts:1053](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1053)
Will be `true` if the query failed while fetching the next page.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchNextPageError`](InfiniteQueryObserverBaseResult.md#isfetchnextpageerror)
***
### isFetchPreviousPageError
```ts
isFetchPreviousPageError: false;
```
Defined in: [packages/query-core/src/types.ts:1054](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1054)
Will be `true` if the query failed while fetching the previous page.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchPreviousPageError`](InfiniteQueryObserverBaseResult.md#isfetchpreviouspageerror)
***
### ~~isInitialLoading~~
```ts
isInitialLoading: boolean;
```
Defined in: [packages/query-core/src/types.ts:836](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L836)
#### Deprecated
`isInitialLoading` is being deprecated in favor of `isLoading`
and will be removed in the next major version.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isInitialLoading`](InfiniteQueryObserverBaseResult.md#isinitialloading)
***
### isLoading
```ts
isLoading: boolean;
```
Defined in: [packages/query-core/src/types.ts:823](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L823)
Is `true` whenever the first fetch for a query is in-flight.
- Is the same as `isFetching && isPending`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoading`](InfiniteQueryObserverBaseResult.md#isloading)
***
### isLoadingError
```ts
isLoadingError: false;
```
Defined in: [packages/query-core/src/types.ts:1051](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1051)
Will be `true` if the query failed while fetching for the first time.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoadingError`](InfiniteQueryObserverBaseResult.md#isloadingerror)
***
### isPaused
```ts
isPaused: boolean;
```
Defined in: [packages/query-core/src/types.ts:841](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L841)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- The query wanted to fetch, but has been `paused`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPaused`](InfiniteQueryObserverBaseResult.md#ispaused)
***
### isPending
```ts
isPending: true;
```
Defined in: [packages/query-core/src/types.ts:1050](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1050)
Will be `pending` if there's no cached data and no query attempt was finished yet.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPending`](InfiniteQueryObserverBaseResult.md#ispending)
***
### isPlaceholderData
```ts
isPlaceholderData: false;
```
Defined in: [packages/query-core/src/types.ts:1056](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1056)
Will be `true` if the data shown is the placeholder data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPlaceholderData`](InfiniteQueryObserverBaseResult.md#isplaceholderdata)
***
### isRefetchError
```ts
isRefetchError: false;
```
Defined in: [packages/query-core/src/types.ts:1052](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1052)
Will be `true` if the query failed while refetching.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetchError`](InfiniteQueryObserverBaseResult.md#isrefetcherror)
***
### isRefetching
```ts
isRefetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:854](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L854)
Is `true` whenever a background refetch is in-flight, which _does not_ include initial `pending`.
- Is the same as `isFetching && !isPending`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetching`](InfiniteQueryObserverBaseResult.md#isrefetching)
***
### isStale
```ts
isStale: boolean;
```
Defined in: [packages/query-core/src/types.ts:858](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L858)
Will be `true` if the data in the cache is invalidated or if the data is older than the given `staleTime`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isStale`](InfiniteQueryObserverBaseResult.md#isstale)
***
### isSuccess
```ts
isSuccess: false;
```
Defined in: [packages/query-core/src/types.ts:1055](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1055)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isSuccess`](InfiniteQueryObserverBaseResult.md#issuccess)
***
### refetch()
```ts
refetch: (options?) => Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:871](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L871)
A function to manually refetch the query.
#### Parameters
##### options?
[`RefetchOptions`](RefetchOptions.md)
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`refetch`](InfiniteQueryObserverBaseResult.md#refetch)
***
### status
```ts
status: "pending";
```
Defined in: [packages/query-core/src/types.ts:1057](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1057)
The status of the query.
- Will be:
- `pending` if there's no cached data and no query attempt was finished yet.
- `error` if the query attempt resulted in an error.
- `success` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`status`](InfiniteQueryObserverBaseResult.md#status)

View File

@@ -0,0 +1,600 @@
---
id: InfiniteQueryObserverPlaceholderResult
title: InfiniteQueryObserverPlaceholderResult
---
Defined in: [packages/query-core/src/types.ts:1130](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1130)
## Extends
- [`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md)\<`TData`, `TError`\>
## Type Parameters
### TData
`TData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
## Properties
### data
```ts
data: TData;
```
Defined in: [packages/query-core/src/types.ts:1134](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1134)
The last successfully resolved data for the query.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`data`](InfiniteQueryObserverBaseResult.md#data)
***
### dataUpdatedAt
```ts
dataUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:775](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L775)
The timestamp for when the query most recently returned the `status` as `"success"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`dataUpdatedAt`](InfiniteQueryObserverBaseResult.md#dataupdatedat)
***
### error
```ts
error: null;
```
Defined in: [packages/query-core/src/types.ts:1136](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1136)
The error object for the query, if an error was thrown.
- Defaults to `null`.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`error`](InfiniteQueryObserverBaseResult.md#error)
***
### errorUpdateCount
```ts
errorUpdateCount: number;
```
Defined in: [packages/query-core/src/types.ts:799](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L799)
The sum of all errors.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdateCount`](InfiniteQueryObserverBaseResult.md#errorupdatecount)
***
### errorUpdatedAt
```ts
errorUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:784](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L784)
The timestamp for when the query most recently returned the `status` as `"error"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdatedAt`](InfiniteQueryObserverBaseResult.md#errorupdatedat)
***
### failureCount
```ts
failureCount: number;
```
Defined in: [packages/query-core/src/types.ts:790](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L790)
The failure count for the query.
- Incremented every time the query fails.
- Reset to `0` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureCount`](InfiniteQueryObserverBaseResult.md#failurecount)
***
### failureReason
```ts
failureReason: TError | null;
```
Defined in: [packages/query-core/src/types.ts:795](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L795)
The failure reason for the query retry.
- Reset to `null` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureReason`](InfiniteQueryObserverBaseResult.md#failurereason)
***
### fetchNextPage()
```ts
fetchNextPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1008](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1008)
This function allows you to fetch the next "page" of results.
#### Parameters
##### options?
[`FetchNextPageOptions`](FetchNextPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchNextPage`](InfiniteQueryObserverBaseResult.md#fetchnextpage)
***
### fetchPreviousPage()
```ts
fetchPreviousPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1014](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1014)
This function allows you to fetch the previous "page" of results.
#### Parameters
##### options?
[`FetchPreviousPageOptions`](FetchPreviousPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchPreviousPage`](InfiniteQueryObserverBaseResult.md#fetchpreviouspage)
***
### fetchStatus
```ts
fetchStatus: FetchStatus;
```
Defined in: [packages/query-core/src/types.ts:889](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L889)
The fetch status of the query.
- `fetching`: Is `true` whenever the queryFn is executing, which includes initial `pending` as well as background refetch.
- `paused`: The query wanted to fetch, but has been `paused`.
- `idle`: The query is not fetching.
- See [Network Mode](https://tanstack.com/query/latest/docs/framework/react/guides/network-mode) for more information.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchStatus`](InfiniteQueryObserverBaseResult.md#fetchstatus)
***
### hasNextPage
```ts
hasNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1020](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1020)
Will be `true` if there is a next page to be fetched (known via the `getNextPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasNextPage`](InfiniteQueryObserverBaseResult.md#hasnextpage)
***
### hasPreviousPage
```ts
hasPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1024](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1024)
Will be `true` if there is a previous page to be fetched (known via the `getPreviousPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasPreviousPage`](InfiniteQueryObserverBaseResult.md#haspreviouspage)
***
### isEnabled
```ts
isEnabled: boolean;
```
Defined in: [packages/query-core/src/types.ts:867](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L867)
`true` if this observer is enabled, `false` otherwise.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isEnabled`](InfiniteQueryObserverBaseResult.md#isenabled)
***
### isError
```ts
isError: false;
```
Defined in: [packages/query-core/src/types.ts:1135](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1135)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query attempt resulted in an error.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isError`](InfiniteQueryObserverBaseResult.md#iserror)
***
### isFetched
```ts
isFetched: boolean;
```
Defined in: [packages/query-core/src/types.ts:808](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L808)
Will be `true` if the query has been fetched.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetched`](InfiniteQueryObserverBaseResult.md#isfetched)
***
### isFetchedAfterMount
```ts
isFetchedAfterMount: boolean;
```
Defined in: [packages/query-core/src/types.ts:813](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L813)
Will be `true` if the query has been fetched after the component mounted.
- This property can be used to not show any previously cached data.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchedAfterMount`](InfiniteQueryObserverBaseResult.md#isfetchedaftermount)
***
### isFetching
```ts
isFetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:818](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L818)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- `true` whenever the `queryFn` is executing, which includes initial `pending` as well as background refetch.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetching`](InfiniteQueryObserverBaseResult.md#isfetching)
***
### isFetchingNextPage
```ts
isFetchingNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1032](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1032)
Will be `true` while fetching the next page with `fetchNextPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingNextPage`](InfiniteQueryObserverBaseResult.md#isfetchingnextpage)
***
### isFetchingPreviousPage
```ts
isFetchingPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1040](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1040)
Will be `true` while fetching the previous page with `fetchPreviousPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingPreviousPage`](InfiniteQueryObserverBaseResult.md#isfetchingpreviouspage)
***
### isFetchNextPageError
```ts
isFetchNextPageError: false;
```
Defined in: [packages/query-core/src/types.ts:1143](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1143)
Will be `true` if the query failed while fetching the next page.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchNextPageError`](InfiniteQueryObserverBaseResult.md#isfetchnextpageerror)
***
### isFetchPreviousPageError
```ts
isFetchPreviousPageError: false;
```
Defined in: [packages/query-core/src/types.ts:1144](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1144)
Will be `true` if the query failed while fetching the previous page.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchPreviousPageError`](InfiniteQueryObserverBaseResult.md#isfetchpreviouspageerror)
***
### ~~isInitialLoading~~
```ts
isInitialLoading: boolean;
```
Defined in: [packages/query-core/src/types.ts:836](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L836)
#### Deprecated
`isInitialLoading` is being deprecated in favor of `isLoading`
and will be removed in the next major version.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isInitialLoading`](InfiniteQueryObserverBaseResult.md#isinitialloading)
***
### isLoading
```ts
isLoading: false;
```
Defined in: [packages/query-core/src/types.ts:1138](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1138)
Is `true` whenever the first fetch for a query is in-flight.
- Is the same as `isFetching && isPending`.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoading`](InfiniteQueryObserverBaseResult.md#isloading)
***
### isLoadingError
```ts
isLoadingError: false;
```
Defined in: [packages/query-core/src/types.ts:1139](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1139)
Will be `true` if the query failed while fetching for the first time.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoadingError`](InfiniteQueryObserverBaseResult.md#isloadingerror)
***
### isPaused
```ts
isPaused: boolean;
```
Defined in: [packages/query-core/src/types.ts:841](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L841)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- The query wanted to fetch, but has been `paused`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPaused`](InfiniteQueryObserverBaseResult.md#ispaused)
***
### isPending
```ts
isPending: false;
```
Defined in: [packages/query-core/src/types.ts:1137](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1137)
Will be `pending` if there's no cached data and no query attempt was finished yet.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPending`](InfiniteQueryObserverBaseResult.md#ispending)
***
### isPlaceholderData
```ts
isPlaceholderData: true;
```
Defined in: [packages/query-core/src/types.ts:1142](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1142)
Will be `true` if the data shown is the placeholder data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPlaceholderData`](InfiniteQueryObserverBaseResult.md#isplaceholderdata)
***
### isRefetchError
```ts
isRefetchError: false;
```
Defined in: [packages/query-core/src/types.ts:1140](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1140)
Will be `true` if the query failed while refetching.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetchError`](InfiniteQueryObserverBaseResult.md#isrefetcherror)
***
### isRefetching
```ts
isRefetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:854](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L854)
Is `true` whenever a background refetch is in-flight, which _does not_ include initial `pending`.
- Is the same as `isFetching && !isPending`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetching`](InfiniteQueryObserverBaseResult.md#isrefetching)
***
### isStale
```ts
isStale: boolean;
```
Defined in: [packages/query-core/src/types.ts:858](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L858)
Will be `true` if the data in the cache is invalidated or if the data is older than the given `staleTime`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isStale`](InfiniteQueryObserverBaseResult.md#isstale)
***
### isSuccess
```ts
isSuccess: true;
```
Defined in: [packages/query-core/src/types.ts:1141](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1141)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isSuccess`](InfiniteQueryObserverBaseResult.md#issuccess)
***
### refetch()
```ts
refetch: (options?) => Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:871](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L871)
A function to manually refetch the query.
#### Parameters
##### options?
[`RefetchOptions`](RefetchOptions.md)
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`refetch`](InfiniteQueryObserverBaseResult.md#refetch)
***
### status
```ts
status: "success";
```
Defined in: [packages/query-core/src/types.ts:1145](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1145)
The status of the query.
- Will be:
- `pending` if there's no cached data and no query attempt was finished yet.
- `error` if the query attempt resulted in an error.
- `success` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`status`](InfiniteQueryObserverBaseResult.md#status)

View File

@@ -0,0 +1,600 @@
---
id: InfiniteQueryObserverRefetchErrorResult
title: InfiniteQueryObserverRefetchErrorResult
---
Defined in: [packages/query-core/src/types.ts:1096](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1096)
## Extends
- [`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md)\<`TData`, `TError`\>
## Type Parameters
### TData
`TData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
## Properties
### data
```ts
data: TData;
```
Defined in: [packages/query-core/src/types.ts:1100](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1100)
The last successfully resolved data for the query.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`data`](InfiniteQueryObserverBaseResult.md#data)
***
### dataUpdatedAt
```ts
dataUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:775](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L775)
The timestamp for when the query most recently returned the `status` as `"success"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`dataUpdatedAt`](InfiniteQueryObserverBaseResult.md#dataupdatedat)
***
### error
```ts
error: TError;
```
Defined in: [packages/query-core/src/types.ts:1101](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1101)
The error object for the query, if an error was thrown.
- Defaults to `null`.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`error`](InfiniteQueryObserverBaseResult.md#error)
***
### errorUpdateCount
```ts
errorUpdateCount: number;
```
Defined in: [packages/query-core/src/types.ts:799](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L799)
The sum of all errors.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdateCount`](InfiniteQueryObserverBaseResult.md#errorupdatecount)
***
### errorUpdatedAt
```ts
errorUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:784](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L784)
The timestamp for when the query most recently returned the `status` as `"error"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdatedAt`](InfiniteQueryObserverBaseResult.md#errorupdatedat)
***
### failureCount
```ts
failureCount: number;
```
Defined in: [packages/query-core/src/types.ts:790](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L790)
The failure count for the query.
- Incremented every time the query fails.
- Reset to `0` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureCount`](InfiniteQueryObserverBaseResult.md#failurecount)
***
### failureReason
```ts
failureReason: TError | null;
```
Defined in: [packages/query-core/src/types.ts:795](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L795)
The failure reason for the query retry.
- Reset to `null` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureReason`](InfiniteQueryObserverBaseResult.md#failurereason)
***
### fetchNextPage()
```ts
fetchNextPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1008](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1008)
This function allows you to fetch the next "page" of results.
#### Parameters
##### options?
[`FetchNextPageOptions`](FetchNextPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchNextPage`](InfiniteQueryObserverBaseResult.md#fetchnextpage)
***
### fetchPreviousPage()
```ts
fetchPreviousPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1014](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1014)
This function allows you to fetch the previous "page" of results.
#### Parameters
##### options?
[`FetchPreviousPageOptions`](FetchPreviousPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchPreviousPage`](InfiniteQueryObserverBaseResult.md#fetchpreviouspage)
***
### fetchStatus
```ts
fetchStatus: FetchStatus;
```
Defined in: [packages/query-core/src/types.ts:889](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L889)
The fetch status of the query.
- `fetching`: Is `true` whenever the queryFn is executing, which includes initial `pending` as well as background refetch.
- `paused`: The query wanted to fetch, but has been `paused`.
- `idle`: The query is not fetching.
- See [Network Mode](https://tanstack.com/query/latest/docs/framework/react/guides/network-mode) for more information.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchStatus`](InfiniteQueryObserverBaseResult.md#fetchstatus)
***
### hasNextPage
```ts
hasNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1020](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1020)
Will be `true` if there is a next page to be fetched (known via the `getNextPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasNextPage`](InfiniteQueryObserverBaseResult.md#hasnextpage)
***
### hasPreviousPage
```ts
hasPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1024](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1024)
Will be `true` if there is a previous page to be fetched (known via the `getPreviousPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasPreviousPage`](InfiniteQueryObserverBaseResult.md#haspreviouspage)
***
### isEnabled
```ts
isEnabled: boolean;
```
Defined in: [packages/query-core/src/types.ts:867](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L867)
`true` if this observer is enabled, `false` otherwise.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isEnabled`](InfiniteQueryObserverBaseResult.md#isenabled)
***
### isError
```ts
isError: true;
```
Defined in: [packages/query-core/src/types.ts:1102](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1102)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query attempt resulted in an error.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isError`](InfiniteQueryObserverBaseResult.md#iserror)
***
### isFetched
```ts
isFetched: boolean;
```
Defined in: [packages/query-core/src/types.ts:808](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L808)
Will be `true` if the query has been fetched.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetched`](InfiniteQueryObserverBaseResult.md#isfetched)
***
### isFetchedAfterMount
```ts
isFetchedAfterMount: boolean;
```
Defined in: [packages/query-core/src/types.ts:813](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L813)
Will be `true` if the query has been fetched after the component mounted.
- This property can be used to not show any previously cached data.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchedAfterMount`](InfiniteQueryObserverBaseResult.md#isfetchedaftermount)
***
### isFetching
```ts
isFetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:818](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L818)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- `true` whenever the `queryFn` is executing, which includes initial `pending` as well as background refetch.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetching`](InfiniteQueryObserverBaseResult.md#isfetching)
***
### isFetchingNextPage
```ts
isFetchingNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1032](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1032)
Will be `true` while fetching the next page with `fetchNextPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingNextPage`](InfiniteQueryObserverBaseResult.md#isfetchingnextpage)
***
### isFetchingPreviousPage
```ts
isFetchingPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1040](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1040)
Will be `true` while fetching the previous page with `fetchPreviousPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingPreviousPage`](InfiniteQueryObserverBaseResult.md#isfetchingpreviouspage)
***
### isFetchNextPageError
```ts
isFetchNextPageError: boolean;
```
Defined in: [packages/query-core/src/types.ts:1028](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1028)
Will be `true` if the query failed while fetching the next page.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchNextPageError`](InfiniteQueryObserverBaseResult.md#isfetchnextpageerror)
***
### isFetchPreviousPageError
```ts
isFetchPreviousPageError: boolean;
```
Defined in: [packages/query-core/src/types.ts:1036](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1036)
Will be `true` if the query failed while fetching the previous page.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchPreviousPageError`](InfiniteQueryObserverBaseResult.md#isfetchpreviouspageerror)
***
### ~~isInitialLoading~~
```ts
isInitialLoading: boolean;
```
Defined in: [packages/query-core/src/types.ts:836](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L836)
#### Deprecated
`isInitialLoading` is being deprecated in favor of `isLoading`
and will be removed in the next major version.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isInitialLoading`](InfiniteQueryObserverBaseResult.md#isinitialloading)
***
### isLoading
```ts
isLoading: false;
```
Defined in: [packages/query-core/src/types.ts:1104](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1104)
Is `true` whenever the first fetch for a query is in-flight.
- Is the same as `isFetching && isPending`.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoading`](InfiniteQueryObserverBaseResult.md#isloading)
***
### isLoadingError
```ts
isLoadingError: false;
```
Defined in: [packages/query-core/src/types.ts:1105](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1105)
Will be `true` if the query failed while fetching for the first time.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoadingError`](InfiniteQueryObserverBaseResult.md#isloadingerror)
***
### isPaused
```ts
isPaused: boolean;
```
Defined in: [packages/query-core/src/types.ts:841](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L841)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- The query wanted to fetch, but has been `paused`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPaused`](InfiniteQueryObserverBaseResult.md#ispaused)
***
### isPending
```ts
isPending: false;
```
Defined in: [packages/query-core/src/types.ts:1103](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1103)
Will be `pending` if there's no cached data and no query attempt was finished yet.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPending`](InfiniteQueryObserverBaseResult.md#ispending)
***
### isPlaceholderData
```ts
isPlaceholderData: false;
```
Defined in: [packages/query-core/src/types.ts:1108](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1108)
Will be `true` if the data shown is the placeholder data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPlaceholderData`](InfiniteQueryObserverBaseResult.md#isplaceholderdata)
***
### isRefetchError
```ts
isRefetchError: true;
```
Defined in: [packages/query-core/src/types.ts:1106](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1106)
Will be `true` if the query failed while refetching.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetchError`](InfiniteQueryObserverBaseResult.md#isrefetcherror)
***
### isRefetching
```ts
isRefetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:854](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L854)
Is `true` whenever a background refetch is in-flight, which _does not_ include initial `pending`.
- Is the same as `isFetching && !isPending`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetching`](InfiniteQueryObserverBaseResult.md#isrefetching)
***
### isStale
```ts
isStale: boolean;
```
Defined in: [packages/query-core/src/types.ts:858](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L858)
Will be `true` if the data in the cache is invalidated or if the data is older than the given `staleTime`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isStale`](InfiniteQueryObserverBaseResult.md#isstale)
***
### isSuccess
```ts
isSuccess: false;
```
Defined in: [packages/query-core/src/types.ts:1107](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1107)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isSuccess`](InfiniteQueryObserverBaseResult.md#issuccess)
***
### refetch()
```ts
refetch: (options?) => Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:871](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L871)
A function to manually refetch the query.
#### Parameters
##### options?
[`RefetchOptions`](RefetchOptions.md)
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`refetch`](InfiniteQueryObserverBaseResult.md#refetch)
***
### status
```ts
status: "error";
```
Defined in: [packages/query-core/src/types.ts:1109](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1109)
The status of the query.
- Will be:
- `pending` if there's no cached data and no query attempt was finished yet.
- `error` if the query attempt resulted in an error.
- `success` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`status`](InfiniteQueryObserverBaseResult.md#status)

View File

@@ -0,0 +1,600 @@
---
id: InfiniteQueryObserverSuccessResult
title: InfiniteQueryObserverSuccessResult
---
Defined in: [packages/query-core/src/types.ts:1112](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1112)
## Extends
- [`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md)\<`TData`, `TError`\>
## Type Parameters
### TData
`TData` = `unknown`
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
## Properties
### data
```ts
data: TData;
```
Defined in: [packages/query-core/src/types.ts:1116](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1116)
The last successfully resolved data for the query.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`data`](InfiniteQueryObserverBaseResult.md#data)
***
### dataUpdatedAt
```ts
dataUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:775](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L775)
The timestamp for when the query most recently returned the `status` as `"success"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`dataUpdatedAt`](InfiniteQueryObserverBaseResult.md#dataupdatedat)
***
### error
```ts
error: null;
```
Defined in: [packages/query-core/src/types.ts:1117](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1117)
The error object for the query, if an error was thrown.
- Defaults to `null`.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`error`](InfiniteQueryObserverBaseResult.md#error)
***
### errorUpdateCount
```ts
errorUpdateCount: number;
```
Defined in: [packages/query-core/src/types.ts:799](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L799)
The sum of all errors.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdateCount`](InfiniteQueryObserverBaseResult.md#errorupdatecount)
***
### errorUpdatedAt
```ts
errorUpdatedAt: number;
```
Defined in: [packages/query-core/src/types.ts:784](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L784)
The timestamp for when the query most recently returned the `status` as `"error"`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`errorUpdatedAt`](InfiniteQueryObserverBaseResult.md#errorupdatedat)
***
### failureCount
```ts
failureCount: number;
```
Defined in: [packages/query-core/src/types.ts:790](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L790)
The failure count for the query.
- Incremented every time the query fails.
- Reset to `0` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureCount`](InfiniteQueryObserverBaseResult.md#failurecount)
***
### failureReason
```ts
failureReason: TError | null;
```
Defined in: [packages/query-core/src/types.ts:795](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L795)
The failure reason for the query retry.
- Reset to `null` when the query succeeds.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`failureReason`](InfiniteQueryObserverBaseResult.md#failurereason)
***
### fetchNextPage()
```ts
fetchNextPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1008](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1008)
This function allows you to fetch the next "page" of results.
#### Parameters
##### options?
[`FetchNextPageOptions`](FetchNextPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchNextPage`](InfiniteQueryObserverBaseResult.md#fetchnextpage)
***
### fetchPreviousPage()
```ts
fetchPreviousPage: (options?) => Promise<InfiniteQueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:1014](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1014)
This function allows you to fetch the previous "page" of results.
#### Parameters
##### options?
[`FetchPreviousPageOptions`](FetchPreviousPageOptions.md)
#### Returns
`Promise`\<[`InfiniteQueryObserverResult`](../type-aliases/InfiniteQueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchPreviousPage`](InfiniteQueryObserverBaseResult.md#fetchpreviouspage)
***
### fetchStatus
```ts
fetchStatus: FetchStatus;
```
Defined in: [packages/query-core/src/types.ts:889](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L889)
The fetch status of the query.
- `fetching`: Is `true` whenever the queryFn is executing, which includes initial `pending` as well as background refetch.
- `paused`: The query wanted to fetch, but has been `paused`.
- `idle`: The query is not fetching.
- See [Network Mode](https://tanstack.com/query/latest/docs/framework/react/guides/network-mode) for more information.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`fetchStatus`](InfiniteQueryObserverBaseResult.md#fetchstatus)
***
### hasNextPage
```ts
hasNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1020](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1020)
Will be `true` if there is a next page to be fetched (known via the `getNextPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasNextPage`](InfiniteQueryObserverBaseResult.md#hasnextpage)
***
### hasPreviousPage
```ts
hasPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1024](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1024)
Will be `true` if there is a previous page to be fetched (known via the `getPreviousPageParam` option).
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`hasPreviousPage`](InfiniteQueryObserverBaseResult.md#haspreviouspage)
***
### isEnabled
```ts
isEnabled: boolean;
```
Defined in: [packages/query-core/src/types.ts:867](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L867)
`true` if this observer is enabled, `false` otherwise.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isEnabled`](InfiniteQueryObserverBaseResult.md#isenabled)
***
### isError
```ts
isError: false;
```
Defined in: [packages/query-core/src/types.ts:1118](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1118)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query attempt resulted in an error.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isError`](InfiniteQueryObserverBaseResult.md#iserror)
***
### isFetched
```ts
isFetched: boolean;
```
Defined in: [packages/query-core/src/types.ts:808](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L808)
Will be `true` if the query has been fetched.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetched`](InfiniteQueryObserverBaseResult.md#isfetched)
***
### isFetchedAfterMount
```ts
isFetchedAfterMount: boolean;
```
Defined in: [packages/query-core/src/types.ts:813](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L813)
Will be `true` if the query has been fetched after the component mounted.
- This property can be used to not show any previously cached data.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchedAfterMount`](InfiniteQueryObserverBaseResult.md#isfetchedaftermount)
***
### isFetching
```ts
isFetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:818](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L818)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- `true` whenever the `queryFn` is executing, which includes initial `pending` as well as background refetch.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetching`](InfiniteQueryObserverBaseResult.md#isfetching)
***
### isFetchingNextPage
```ts
isFetchingNextPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1032](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1032)
Will be `true` while fetching the next page with `fetchNextPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingNextPage`](InfiniteQueryObserverBaseResult.md#isfetchingnextpage)
***
### isFetchingPreviousPage
```ts
isFetchingPreviousPage: boolean;
```
Defined in: [packages/query-core/src/types.ts:1040](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1040)
Will be `true` while fetching the previous page with `fetchPreviousPage`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchingPreviousPage`](InfiniteQueryObserverBaseResult.md#isfetchingpreviouspage)
***
### isFetchNextPageError
```ts
isFetchNextPageError: false;
```
Defined in: [packages/query-core/src/types.ts:1123](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1123)
Will be `true` if the query failed while fetching the next page.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchNextPageError`](InfiniteQueryObserverBaseResult.md#isfetchnextpageerror)
***
### isFetchPreviousPageError
```ts
isFetchPreviousPageError: false;
```
Defined in: [packages/query-core/src/types.ts:1124](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1124)
Will be `true` if the query failed while fetching the previous page.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isFetchPreviousPageError`](InfiniteQueryObserverBaseResult.md#isfetchpreviouspageerror)
***
### ~~isInitialLoading~~
```ts
isInitialLoading: boolean;
```
Defined in: [packages/query-core/src/types.ts:836](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L836)
#### Deprecated
`isInitialLoading` is being deprecated in favor of `isLoading`
and will be removed in the next major version.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isInitialLoading`](InfiniteQueryObserverBaseResult.md#isinitialloading)
***
### isLoading
```ts
isLoading: false;
```
Defined in: [packages/query-core/src/types.ts:1120](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1120)
Is `true` whenever the first fetch for a query is in-flight.
- Is the same as `isFetching && isPending`.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoading`](InfiniteQueryObserverBaseResult.md#isloading)
***
### isLoadingError
```ts
isLoadingError: false;
```
Defined in: [packages/query-core/src/types.ts:1121](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1121)
Will be `true` if the query failed while fetching for the first time.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isLoadingError`](InfiniteQueryObserverBaseResult.md#isloadingerror)
***
### isPaused
```ts
isPaused: boolean;
```
Defined in: [packages/query-core/src/types.ts:841](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L841)
A derived boolean from the `fetchStatus` variable, provided for convenience.
- The query wanted to fetch, but has been `paused`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPaused`](InfiniteQueryObserverBaseResult.md#ispaused)
***
### isPending
```ts
isPending: false;
```
Defined in: [packages/query-core/src/types.ts:1119](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1119)
Will be `pending` if there's no cached data and no query attempt was finished yet.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPending`](InfiniteQueryObserverBaseResult.md#ispending)
***
### isPlaceholderData
```ts
isPlaceholderData: false;
```
Defined in: [packages/query-core/src/types.ts:1126](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1126)
Will be `true` if the data shown is the placeholder data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isPlaceholderData`](InfiniteQueryObserverBaseResult.md#isplaceholderdata)
***
### isRefetchError
```ts
isRefetchError: false;
```
Defined in: [packages/query-core/src/types.ts:1122](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1122)
Will be `true` if the query failed while refetching.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetchError`](InfiniteQueryObserverBaseResult.md#isrefetcherror)
***
### isRefetching
```ts
isRefetching: boolean;
```
Defined in: [packages/query-core/src/types.ts:854](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L854)
Is `true` whenever a background refetch is in-flight, which _does not_ include initial `pending`.
- Is the same as `isFetching && !isPending`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isRefetching`](InfiniteQueryObserverBaseResult.md#isrefetching)
***
### isStale
```ts
isStale: boolean;
```
Defined in: [packages/query-core/src/types.ts:858](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L858)
Will be `true` if the data in the cache is invalidated or if the data is older than the given `staleTime`.
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isStale`](InfiniteQueryObserverBaseResult.md#isstale)
***
### isSuccess
```ts
isSuccess: true;
```
Defined in: [packages/query-core/src/types.ts:1125](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1125)
A derived boolean from the `status` variable, provided for convenience.
- `true` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`isSuccess`](InfiniteQueryObserverBaseResult.md#issuccess)
***
### refetch()
```ts
refetch: (options?) => Promise<QueryObserverResult<TData, TError>>;
```
Defined in: [packages/query-core/src/types.ts:871](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L871)
A function to manually refetch the query.
#### Parameters
##### options?
[`RefetchOptions`](RefetchOptions.md)
#### Returns
`Promise`\<[`QueryObserverResult`](../type-aliases/QueryObserverResult.md)\<`TData`, `TError`\>\>
#### Inherited from
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`refetch`](InfiniteQueryObserverBaseResult.md#refetch)
***
### status
```ts
status: "success";
```
Defined in: [packages/query-core/src/types.ts:1127](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L1127)
The status of the query.
- Will be:
- `pending` if there's no cached data and no query attempt was finished yet.
- `error` if the query attempt resulted in an error.
- `success` if the query has received a response with no errors and is ready to display its data.
#### Overrides
[`InfiniteQueryObserverBaseResult`](InfiniteQueryObserverBaseResult.md).[`status`](InfiniteQueryObserverBaseResult.md#status)

View File

@@ -0,0 +1,683 @@
---
id: InfiniteQueryOptions
title: InfiniteQueryOptions
---
Defined in: [packages/solid-query/src/types.ts:157](https://github.com/TanStack/query/blob/main/packages/solid-query/src/types.ts#L157)
The options accepted by `useInfiniteQuery`.
## Extends
- [`OmitKeyof`](../type-aliases/OmitKeyof.md)\<[`InfiniteQueryObserverOptions`](InfiniteQueryObserverOptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>, `"queryKey"` \| `"suspense"`\>
## Type Parameters
### TQueryFnData
`TQueryFnData` = `unknown`
The type of a single page, as your `queryFn` resolves it.
### TError
`TError` = [`DefaultError`](../type-aliases/DefaultError.md)
The type of errors your `queryFn` may throw.
### TData
`TData` = `TQueryFnData`
The type `data` ends up as after `select` runs.
### TQueryKey
`TQueryKey` *extends* [`QueryKey`](../type-aliases/QueryKey.md) = [`QueryKey`](../type-aliases/QueryKey.md)
The type of your `queryKey`.
### TPageParam
`TPageParam` = `unknown`
The type of the parameter passed to `queryFn` to fetch a given page.
## Properties
### deferStream?
```ts
optional deferStream: boolean;
```
Defined in: [packages/solid-query/src/types.ts:180](https://github.com/TanStack/query/blob/main/packages/solid-query/src/types.ts#L180)
Only applicable while rendering queries on the server with streaming.
Set `deferStream` to `true` to wait for the query to resolve on the server before flushing the stream.
This can be useful to avoid sending a loading state to the client before the query has resolved.
Defaults to `false`.
***
### enabled?
```ts
optional enabled: QueryBooleanOption<TQueryFnData, TError, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:398](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L398)
Set this to `false` or a function that returns `false` to disable automatic refetching when the query mounts or changes query keys.
To refetch the query, use the `refetch` method returned from the `useQuery` instance.
Accepts a boolean or function that returns a boolean.
Defaults to `true`.
#### Inherited from
```ts
OmitKeyof.enabled
```
***
### gcTime?
```ts
optional gcTime: number;
```
Defined in: [packages/query-core/src/types.ts:277](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L277)
The time in milliseconds that unused/inactive cache data remains in memory.
When a query's cache becomes unused or inactive, that cache data will be garbage collected after this duration.
When different garbage collection times are specified, the longest one will be used.
Setting it to `Infinity` will disable garbage collection.
Defaults to `5 * 60 * 1000` (5 minutes), or `Infinity` during SSR.
Note: the maximum allowed time is about 24 days, imposed by `setTimeout`'s 32-bit signed integer delay — see
`timeoutManager.setTimeoutProvider` for a workaround.
#### Inherited from
[`QueryExecuteOptions`](QueryExecuteOptions.md).[`gcTime`](QueryExecuteOptions.md#gctime)
***
### getNextPageParam
```ts
getNextPageParam: GetNextPageParamFunction<TPageParam, TQueryFnData>;
```
Defined in: [packages/query-core/src/types.ts:365](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L365)
This function can be set to automatically get the next cursor for infinite queries.
The result will also be used to determine the value of `hasNextPage`.
#### Inherited from
```ts
OmitKeyof.getNextPageParam
```
***
### getPreviousPageParam?
```ts
optional getPreviousPageParam: GetPreviousPageParamFunction<TPageParam, TQueryFnData>;
```
Defined in: [packages/query-core/src/types.ts:360](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L360)
This function can be set to automatically get the previous cursor for infinite queries.
The result will also be used to determine the value of `hasPreviousPage`.
#### Inherited from
```ts
OmitKeyof.getPreviousPageParam
```
***
### initialData?
```ts
optional initialData:
| InfiniteData<TQueryFnData, TPageParam>
| InitialDataFunction<InfiniteData<TQueryFnData, TPageParam>>;
```
Defined in: [packages/query-core/src/types.ts:317](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L317)
If set, this value will be used as the initial data for the query cache (as long as the query hasn't been
created or cached yet).
If set to a function, the function will be called **once** during the shared/root query initialization, and be
expected to synchronously return the initial data.
Initial data is considered stale by default unless a `staleTime` has been set.
`initialData` **is persisted** to the cache.
#### Inherited from
```ts
OmitKeyof.initialData
```
***
### initialDataUpdatedAt?
```ts
optional initialDataUpdatedAt: number | () => number | undefined;
```
Defined in: [packages/query-core/src/types.ts:321](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L321)
If set, this value will be used as the time (in milliseconds) of when the `initialData` itself was last updated.
#### Inherited from
```ts
OmitKeyof.initialDataUpdatedAt
```
***
### initialPageParam
```ts
initialPageParam: TPageParam;
```
Defined in: [packages/query-core/src/types.ts:349](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L349)
#### Inherited from
```ts
OmitKeyof.initialPageParam
```
***
### maxPages?
```ts
optional maxPages: number;
```
Defined in: [packages/query-core/src/types.ts:345](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L345)
Maximum number of pages to store in the data of an infinite query.
#### Inherited from
[`QueryExecuteOptions`](QueryExecuteOptions.md).[`maxPages`](QueryExecuteOptions.md#maxpages)
***
### meta?
```ts
optional meta: Record<string, unknown>;
```
Defined in: [packages/query-core/src/types.ts:341](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L341)
Additional payload to be stored on each query.
Use this property to pass information that can be used in other places.
#### Inherited from
[`QueryExecuteOptions`](QueryExecuteOptions.md).[`meta`](QueryExecuteOptions.md#meta)
***
### networkMode?
```ts
optional networkMode: NetworkMode;
```
Defined in: [packages/query-core/src/types.ts:265](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L265)
Controls whether a query is allowed to run based on the current network connectivity.
Defaults to `'online'`.
#### See
[Network Mode](https://tanstack.com/query/latest/docs/framework/react/guides/network-mode) for more information.
#### Inherited from
[`QueryExecuteOptions`](QueryExecuteOptions.md).[`networkMode`](QueryExecuteOptions.md#networkmode)
***
### notifyOnChangeProps?
```ts
optional notifyOnChangeProps: NotifyOnChangeProps;
```
Defined in: [packages/query-core/src/types.ts:484](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L484)
If set, the component will only re-render if any of the listed properties change.
When set to `['data', 'error']`, the component will only re-render when the `data` or `error` properties change.
When set to `'all'`, the component will re-render whenever a query is updated.
When set to a function, the function will be executed to compute the list of properties.
Defaults to `undefined`, in which case property access is tracked automatically, and the
component only re-renders when one of the tracked properties changes.
#### Inherited from
```ts
OmitKeyof.notifyOnChangeProps
```
***
### persister?
```ts
optional persister: QueryPersister<TQueryFnData, NoInfer<TQueryKey>, TPageParam>;
```
Defined in: [packages/query-core/src/types.ts:290](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L290)
This option can be used to persist the result of a query to an external storage, bypassing the need to actually
call the `queryFn`. Useful for persisting a query's data across e.g. server/client boundaries.
#### Inherited from
```ts
OmitKeyof.persister
```
***
### placeholderData?
```ts
optional placeholderData:
| InfiniteData<TQueryFnData, TPageParam>
| PlaceholderDataFunction<InfiniteData<TQueryFnData, TPageParam>, TError, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:511](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L511)
If set, this value will be used as the placeholder data for this particular query observer while the query is still in the `loading` data and no initialData has been provided.
#### Inherited from
```ts
OmitKeyof.placeholderData
```
***
### queryFn?
```ts
optional queryFn:
| typeof skipToken
| QueryFunction<TQueryFnData, TQueryKey, TPageParam>;
```
Defined in: [packages/query-core/src/types.ts:285](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L285)
The function that the query will use to request data.
Required, unless a default query function has been set via `queryClient.setQueryDefaults` or
`queryClient.setDefaultOptions`.
Receives a [QueryFunctionContext](../type-aliases/QueryFunctionContext.md).
Must return a promise that will either resolve data or throw an error. The data cannot be `undefined`.
#### Inherited from
```ts
OmitKeyof.queryFn
```
***
### queryHash?
```ts
optional queryHash: string;
```
Defined in: [packages/query-core/src/types.ts:295](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L295)
The hashed form of `queryKey`, computed with `queryKeyHashFn` (or the default hashing function otherwise). Used
as the actual cache key internally.
#### Inherited from
[`QueryExecuteOptions`](QueryExecuteOptions.md).[`queryHash`](QueryExecuteOptions.md#queryhash)
***
### queryKey
```ts
queryKey: TQueryKey;
```
Defined in: [packages/solid-query/src/types.ts:173](https://github.com/TanStack/query/blob/main/packages/solid-query/src/types.ts#L173)
***
### queryKeyHashFn?
```ts
optional queryKeyHashFn: QueryKeyHashFunction<TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:308](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L308)
If specified, this function is used to hash the `queryKey` to a string.
#### Inherited from
```ts
OmitKeyof.queryKeyHashFn
```
***
### reconcile?
```ts
optional reconcile: string | false | (oldData, newData) => TData;
```
Defined in: [packages/solid-query/src/QueryClient.ts:84](https://github.com/TanStack/query/blob/main/packages/solid-query/src/QueryClient.ts#L84)
Set this to a reconciliation key to enable reconciliation between query results.
Set this to `false` to disable reconciliation between query results.
Set this to a function which accepts the old and new data and returns resolved data of the same type to implement custom reconciliation logic.
Defaults reconciliation to false.
#### Inherited from
```ts
OmitKeyof.reconcile
```
***
### refetchInterval?
```ts
optional refetchInterval: number | false | (query) => number | false | undefined;
```
Defined in: [packages/query-core/src/types.ts:414](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L414)
If set to a number, the query will continuously refetch at this frequency in milliseconds.
If set to a function, the function will be executed with the latest data and query to compute a frequency
Defaults to `false`.
#### Inherited from
```ts
OmitKeyof.refetchInterval
```
***
### refetchIntervalInBackground?
```ts
optional refetchIntervalInBackground: boolean;
```
Defined in: [packages/query-core/src/types.ts:425](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L425)
If set to `true`, the query will continue to refetch while their tab/window is in the background.
Defaults to `false`.
#### Inherited from
```ts
OmitKeyof.refetchIntervalInBackground
```
***
### refetchOnMount?
```ts
optional refetchOnMount: boolean | "always" | (query) => boolean | "always";
```
Defined in: [packages/query-core/src/types.ts:462](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L462)
If set to `true`, the query will refetch on mount if the data is stale.
If set to `false`, will disable additional instances of a query to trigger background refetch.
If set to `'always'`, the query will always refetch on mount (except when `staleTime: 'static'` is used).
If set to a function, the function will be executed with the latest data and query to compute the value
Defaults to `true`.
#### Inherited from
```ts
OmitKeyof.refetchOnMount
```
***
### refetchOnReconnect?
```ts
optional refetchOnReconnect: boolean | "always" | (query) => boolean | "always";
```
Defined in: [packages/query-core/src/types.ts:448](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L448)
If set to `true`, the query will refetch on reconnect if the data is stale.
If set to `false`, the query will not refetch on reconnect.
If set to `'always'`, the query will always refetch on reconnect (except when `staleTime: 'static'` is used).
If set to a function, the function will be executed with the latest data and query to compute the value.
Defaults to `true` unless `networkMode` is `'always'`.
#### Inherited from
```ts
OmitKeyof.refetchOnReconnect
```
***
### refetchOnWindowFocus?
```ts
optional refetchOnWindowFocus: boolean | "always" | (query) => boolean | "always";
```
Defined in: [packages/query-core/src/types.ts:434](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L434)
If set to `true`, the query will refetch on window focus if the data is stale.
If set to `false`, the query will not refetch on window focus.
If set to `'always'`, the query will always refetch on window focus (except when `staleTime: 'static'` is used).
If set to a function, the function will be executed with the latest data and query to compute the value.
Defaults to `true`.
#### Inherited from
```ts
OmitKeyof.refetchOnWindowFocus
```
***
### retry?
```ts
optional retry: RetryValue<TError>;
```
Defined in: [packages/query-core/src/types.ts:246](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L246)
If `false`, failed queries will not retry by default.
If `true`, failed queries will retry infinitely.
If set to an integer number, e.g. 3, failed queries will retry until the failed query count meets that number.
If set to a function `(failureCount, error) => boolean` failed queries will retry until the function returns false.
Defaults to `3` on the client and `0` on the server.
#### Inherited from
```ts
OmitKeyof.retry
```
***
### retryDelay?
```ts
optional retryDelay: RetryDelayValue<TError>;
```
Defined in: [packages/query-core/src/types.ts:258](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L258)
This function receives a `retryAttempt` integer and the actual Error and returns the delay to apply before the
next attempt in milliseconds.
A function like `attempt => Math.min(attempt > 1 ? 2 ** attempt * 1000 : 1000, 30 * 1000)` applies exponential
backoff.
A function like `attempt => attempt * 1000` applies linear backoff.
Defaults to a function that applies exponential backoff, capped at 30 seconds.
#### Inherited from
```ts
OmitKeyof.retryDelay
```
***
### retryOnMount?
```ts
optional retryOnMount: QueryBooleanOption<TQueryFnData, TError, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:474](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L474)
If set to `false`, the query will not be retried on mount if it contains an error.
If set to a function, the function will be executed with the query to compute the value.
Defaults to `true`.
#### Inherited from
```ts
OmitKeyof.retryOnMount
```
***
### select()?
```ts
optional select: (data) => TData;
```
Defined in: [packages/query-core/src/types.ts:500](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L500)
This option can be used to transform or select a part of the data returned by the query function. It affects
the returned `data` value, but does not affect what gets stored in the query cache.
The `select` function will only run if `data` changed, or if the reference to the `select` function itself
changes. To optimize, memoize the function so its reference stays stable across calls.
#### Parameters
##### data
[`InfiniteData`](InfiniteData.md)
#### Returns
`TData`
#### Inherited from
```ts
OmitKeyof.select
```
***
### staleTime?
```ts
optional staleTime: StaleTimeFunction<TQueryFnData, TError, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:407](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L407)
The time in milliseconds after data is considered stale.
If set to `Infinity`, the data will never be considered stale.
If set to `'static'`, the data will never be considered stale.
If set to a function, the function will be executed with the query to compute a `staleTime`.
Defaults to `0`.
#### Inherited from
```ts
OmitKeyof.staleTime
```
***
### ~~suspense?~~
```ts
optional suspense: boolean;
```
Defined in: [packages/solid-query/src/types.ts:186](https://github.com/TanStack/query/blob/main/packages/solid-query/src/types.ts#L186)
#### Deprecated
The `suspense` option has been deprecated in v5 and will be removed in the next major version.
The `data` property on useInfiniteQuery is a SolidJS resource and will automatically suspend when the data is loading.
Setting `suspense` to `false` will be a no-op.
***
### throwOnError?
```ts
optional throwOnError: ThrowOnError<TQueryFnData, TError, InfiniteData<TQueryFnData, TPageParam>, TQueryKey>;
```
Defined in: [packages/query-core/src/types.ts:493](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L493)
Whether errors should be thrown instead of setting the `error` property.
If set to `true` or `suspense` is `true`, all errors will be thrown to the error boundary.
If set to `false` and `suspense` is `false`, errors are returned as state.
If set to a function, it will be passed the error and the query, and it should return a boolean indicating whether to show the error in an error boundary (`true`) or return the error as state (`false`).
Defaults to `false`.
#### Inherited from
```ts
OmitKeyof.throwOnError
```

View File

@@ -0,0 +1,60 @@
---
id: InfiniteQueryPageParamsOptions
title: InfiniteQueryPageParamsOptions
---
Defined in: [packages/query-core/src/types.ts:352](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L352)
## Extends
- [`InitialPageParam`](InitialPageParam.md)\<`TPageParam`\>
## Type Parameters
### TQueryFnData
`TQueryFnData` = `unknown`
### TPageParam
`TPageParam` = `unknown`
## Properties
### getNextPageParam
```ts
getNextPageParam: GetNextPageParamFunction<TPageParam, TQueryFnData>;
```
Defined in: [packages/query-core/src/types.ts:365](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L365)
This function can be set to automatically get the next cursor for infinite queries.
The result will also be used to determine the value of `hasNextPage`.
***
### getPreviousPageParam?
```ts
optional getPreviousPageParam: GetPreviousPageParamFunction<TPageParam, TQueryFnData>;
```
Defined in: [packages/query-core/src/types.ts:360](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L360)
This function can be set to automatically get the previous cursor for infinite queries.
The result will also be used to determine the value of `hasPreviousPage`.
***
### initialPageParam
```ts
initialPageParam: TPageParam;
```
Defined in: [packages/query-core/src/types.ts:349](https://github.com/TanStack/query/blob/main/packages/query-core/src/types.ts#L349)
#### Inherited from
[`InitialPageParam`](InitialPageParam.md).[`initialPageParam`](InitialPageParam.md#initialpageparam)

Some files were not shown because too many files have changed in this diff Show More