Cached queries
Define read endpoints whose responses should be cached and reused across components.
Redux Toolkit · Function
createApi
createApi defines RTK Query endpoints and their request behavior, then generates an API slice for Redux data fetching and caching. The React-specific entry point additionally generates hooks for those endpoints.
How it works
Call createApi with a baseQuery or custom request logic and an endpoints builder. It returns an API slice containing Redux reducer and middleware integration, endpoint thunks and selectors, and—when imported from the React entry point—generated hooks.
Syntax
createApi(options)Parameters
| Name | Type | Description |
|---|---|---|
options | CreateApiOptions | Configuration object defining the API slice, including baseQuery or endpoint request logic, reducerPath, and endpoint builders. |
Returns
An API service slice containing a reducer, middleware, endpoint thunks, selectors, and, for the React entry point, generated hooks.
Key points
- createApi is the main entry point for defining RTK Query data-fetching and caching behavior.
- You declare named endpoints that describe operations against backend APIs or other asynchronous sources.
- The function generates an API slice containing the Redux machinery needed to manage requests and cached results.
- Endpoint definitions support ordinary cached queries, infinite queries, and mutations.
- Use build.query for server reads whose results should be cached.
- Use build.mutation for write operations and server-side updates.
- Importing from the React entry point adds hooks corresponding to the declared endpoints.
Common mistakes
- Usually define one API slice per application and base URL rather than creating separate slices for each endpoint.
Example: Create a cached API slice
import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
export const postsApi = createApi({
reducerPath: 'postsApi',
baseQuery: fetchBaseQuery({ baseUrl: '/api' }),
endpoints: (build) => ({
getPosts: build.query<Post[], void>({
query: () => 'posts',
}),
}),
})
export const { useGetPostsQuery } = postsApiThis creates an API slice with a base URL and a cached query endpoint, then exposes the generated React hook.
When to use it
Mutations
Describe server writes and coordinate invalidation or refetching of related cached queries.
React data access
Expose endpoint-specific React hooks from a UI-integrated API service.
Custom request workflows
Use custom asynchronous logic when a request cannot be expressed through the configured baseQuery.
Interview questions
QWhat does createApi provide?
createApi is RTK Query's central API-definition function. It describes endpoints and request behavior, then generates an API slice with Redux logic for fetching and caching; the React entry point also generates hooks.
Follow-up: How is the generated slice integrated into Redux? Add its reducer at the configured reducerPath and include its middleware in configureStore.
QHow do endpoint definitions choose request logic?
The baseQuery establishes the default request mechanism and can be used by endpoints that provide a query value. An endpoint can instead provide queryFn when it needs custom asynchronous logic.
Follow-up: What endpoint kinds are available? Query endpoints cache fetched data, infiniteQuery endpoints support infinite data, and mutation endpoints send server updates and can invalidate queries.
QWhat does the returned API slice contain?
The returned API object includes endpoint-specific Redux thunks and selectors. With the React-specific import, it also includes generated hooks for those endpoints.
Follow-up: What must be configured in the store? Add the API reducer using reducerPath and the API middleware so cache lifetimes, subscriptions, invalidation, and polling operate.
Related
fetchBaseQuerybuild.querybuild.infiniteQuerybuild.mutationreducerPathconfigureStore