Skip an optional-argument query
A component receives an optional identifier and must not fetch until it exists.
Redux Toolkit · Function
skipToken
skipToken is an RTK Query value for conditionally disabling a query without weakening the endpoint argument type. Pass it instead of an unavailable argument to supported query hooks or selectors.
How it works
skipToken is a Redux Toolkit Query export used as a query argument for useQuery, useQueryState, or useQuerySubscription. It produces the same behavior as skip: true while allowing a possibly undefined argument to remain type-safe; selectors receiving it return an uninitialized state.
Syntax
useQuery(queryArg | skipToken, options?)Parameters
| Name | Type | Description |
|---|---|---|
arg | QueryArg | SkipToken | The endpoint query argument, or skipToken to prevent the query from running. |
options | UseQueryOptions | Optional hook settings; useQuery options can also contain skip: true. |
Returns
For query hooks, the normal query hook result with an uninitialized state while skipped; selectors passed skipToken return a default uninitialized state.
Key points
- It is an RTK Query export that provides another way to disable automatic query execution.
- The supported hooks accept skipToken directly as their query argument.
- For those hooks, skipToken behaves like the skip: true option.
- It is especially useful when the endpoint argument may otherwise be undefined.
- Using a nullish fallback preserves the endpoint's concrete argument type for TypeScript.
Common mistakes
- Passing skipToken to a selector does not read cached data; it deliberately returns an uninitialized result.
Example: Skip a query when an argument is unavailable
import { skipToken } from '@reduxjs/toolkit/query/react'
import { useGetPostQuery } from './api'
function MaybePost({ id }: { id?: number }) {
const { data, isUninitialized } = useGetPostQuery(id ?? skipToken)
return <div>{isUninitialized ? 'Choose a post' : data?.title}</div>
}Passes skipToken when id is absent, so the hook remains type-safe while the query is skipped.
When to use it
Preserve endpoint type safety
A TypeScript endpoint requires a concrete argument, but the UI conditionally lacks one.
Return an uninitialized selector state
A selector should represent a disabled query without selecting cache data.
Interview questions
QWhat problem does skipToken solve?
skipToken is a special RTK Query export used in place of a query argument. For the supported query hooks, it has the same effect as setting skip: true and is useful when the normal argument could be undefined.
Follow-up: How would you preserve endpoint argument types when an optional ID is available? Use id ?? skipToken, so the endpoint receives either its declared ID type or the special skip value.
QHow is skipToken passed to a query hook?
Use skipToken as the argument to useQuery, useQueryState, or useQuerySubscription. A common pattern is useGetPostQuery(id ?? skipToken), which skips only when id is nullish.
Follow-up: What happens if the condition is represented by an empty string rather than null or undefined? The expression must encode that policy explicitly, such as condition ? value : skipToken.
QWhat does skipToken do in a selector?
RTK Query also accepts skipToken in query selectors. When supplied there, the selector returns a default uninitialized state, which lets code avoid selecting a value for a disabled query.
Follow-up: Why might a selector use this instead of conditionally calling a selector factory? It provides a stable, documented disabled-query result rather than attempting to select with an invalid cache argument.
Related
skipuseQueryuseQueryStateuseQuerySubscriptionSkipToken