TanStack
API Reference

dehydrate

ts
function dehydrate(client: QueryClient, options?: DehydrateOptions): DehydratedState;

Defined in: packages/query-core/src/hydration.ts:245

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

The client whose cache is dehydrated.

options?

DehydrateOptions = {}

Controls which queries and mutations are included and how their data and errors are transformed. Each option falls back to the client's defaultOptions.dehydrate.

options properties

PropertyTypeDescription
serializeData?TransformerFnTransforms a query's data before it is dehydrated. Useful for non-JSON-serializable data.
shouldDehydrateMutation?(mutation: Mutation) => booleanPredicate to decide whether a given Mutation should be dehydrated. Defaults to defaultShouldDehydrateMutation.
shouldDehydrateQuery?(query: Query) => booleanPredicate to decide whether a given Query should be dehydrated. Defaults to defaultShouldDehydrateQuery.
shouldRedactErrors?(error: unknown) => booleanPredicate 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.

Returns

DehydratedState

The dehydrated state, with the included queries and mutations.

Result properties

PropertyTypeDescription
mutationsDehydratedMutation[]The dehydrated mutations, by default only the paused ones.
queriesDehydratedQuery[]The dehydrated queries, by default only the successful ones.

Example

ts
const queryClient = new QueryClient()

await queryClient.prefetchQuery({
  queryKey: ['posts'],
  queryFn: getPosts,
})

const dehydratedState = dehydrate(queryClient)