API reference
Redux Toolkit API reference
Redux Toolkit state management
- Identifiers
- 105
- With full guides
- 83
- Types
- 5
Topics covered
- createSlice
- configureStore
- RTK Query
- Async thunks
- Selectors & reselect
- Normalised state
- Immer updates
- DevTools
Component
| Name | What it does |
|---|---|
Provider | Provider makes a Redux store available to nested React components through React Redux context. It is usually rendered at the top of the application tree around the app. |
Function
| Name | What it does |
|---|---|
configureStore | configureStore is Redux Toolkit's standard API for creating a Redux store with sensible defaults. It accepts named configuration options and handles reducer composition, middleware, enhancers, and DevTools setup. |
createSlice | createSlice defines a feature's Redux state and case reducers, then generates the matching reducer, action creators, and action types. It uses Immer so reducer code can express immutable updates with mutation-like syntax. |
createAsyncThunk | createAsyncThunk generates a thunk for promise-based work and dispatches pending, fulfilled, and rejected actions around it. It leaves state updates to reducers that handle those lifecycle actions. |
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. |
createSelector | Redux Toolkit re-exports Reselect's createSelector for building memoized selectors. It combines input selectors with a result function to calculate derived data efficiently. |
createEntityAdapter | createEntityAdapter generates reducers and selectors for managing normalized collections of entities. It returns an adapter with CRUD operations, initial-state creation, and selector helpers. |
createReducer | createReducer constructs a Redux reducer from initial state and a builder callback. It supports exact action cases, matchers, default handling, and Immer-powered immutable updates written with mutating syntax. |
createAction | createAction combines an action type and creator into one helper. It returns a callable action creator whose argument normally becomes payload, with an optional prepare callback for custom action construction. |
combineReducers | combineReducers turns a map of slice reducers into one reducer that builds a matching state object. Redux Toolkit's configureStore performs this combination automatically when given an object of reducers. |
combineSlices | Combines Redux Toolkit slices and reducer maps into one reducer, mounting slices by reducerPath or map key. The returned reducer supports injecting additional slices after initialization. |
createListenerMiddleware | Creates Redux middleware for running effect callbacks in response to matching actions or state changes. It also provides APIs for registering listeners statically or dynamically and for building async workflows. |
getDefaultMiddleware | getDefaultMiddleware returns Redux Toolkit's standard middleware array for use in configureStore. Its options can disable or configure individual defaults, while concat and prepend support adding custom middleware. |
nanoid | nanoid is a Redux Toolkit utility that generates a random, non-cryptographically-secure ID string. createAsyncThunk uses it by default for request IDs, and applications can call it directly for other ordinary identifiers. |
unwrapResult | unwrapResult converts the action returned by a dispatched createAsyncThunk into its original result. It returns a fulfilled payload and throws the rejection payload or error for failed thunks. |
current | |
original | |
isDraft | isDraft checks whether a value is a Proxy-wrapped Immer draft state. Redux Toolkit re-exports this Immer utility for inspecting values handled during immutable update logic. |
freeze | |
createDraftSafeSelector | createDraftSafeSelector is Redux Toolkit’s draft-aware version of createSelector. It preserves normal memoization for plain state but recalculates for Immer drafts to avoid stale results. |
createDynamicMiddleware | Creates a meta-middleware instance that lets applications add middleware to a Redux dispatch chain after store initialization. Register its middleware wrapper during store setup, then inject middleware through the instance. |
autoBatchEnhancer | autoBatchEnhancer delays subscriber notifications while consecutive low-priority actions are dispatched. It flushes on its scheduled callback or when a normal-priority action arrives in the same tick. |
prepareAutoBatched | prepareAutoBatched creates a typed createSlice prepare callback that marks an action for automatic batching. The enhancer uses that marker to delay subscriber notifications for low-priority actions. |
createNextState | createNextState is Redux Toolkit’s re-export of Immer’s default immutable update function, also known as produce. It lets a recipe describe changes against a draft while preserving immutable state updates. |
isAnyOf | isAnyOf creates a type-safe matcher that succeeds when any supplied action creator or matcher function matches an action. It is commonly passed to builder.addMatcher or used in custom middleware. |
isAllOf | isAllOf creates a type-safe matcher that succeeds only when every supplied action creator or type guard matches the same value. The returned matcher can be used in reducers, middleware, or other TypeScript code. |
isPending | isPending creates a type-safe matcher for pending createAsyncThunk lifecycle actions. Provide thunks to restrict matches to those action creators, or use the general form to match pending thunk actions. |
isFulfilled | isFulfilled creates a type-guard matcher for fulfilled actions generated by createAsyncThunk. Supply one or more thunk action creators, then use the returned matcher to test actions and obtain narrowed TypeScript types. |
isRejected | isRejected creates a type-safe matcher for rejected createAsyncThunk lifecycle actions. Optionally provide thunk action creators to limit which rejected actions match. |
isRejectedWithValue | isRejectedWithValue creates a type-guard matcher for rejected createAsyncThunk actions that used rejectWithValue. It can optionally be scoped to one or more thunk action creators. |
isAsyncThunkAction | Returns a type-guard matcher for actions created by createAsyncThunk. Pass thunk creators to restrict matches to those thunks, or omit them to recognize async-thunk actions generally. |
isActionCreator | isActionCreator is a configurable predicate used by Redux Toolkit's action-creator invariant middleware. It identifies values that should be treated as action creators, including custom action-creator shapes. |
fetchBaseQuery | fetchBaseQuery is a lightweight wrapper around fetch that creates an RTK Query-compatible baseQuery function. Configure shared request behavior once, then use the returned function in createApi. |
retry | RTK Query's retry utility wraps a base query and retries failed requests with exponential backoff. Configure maxRetries per API or endpoint, and use retry.fail to stop immediately when further attempts cannot help. |
setupListeners | Enables RTK Query to react to browser focus and network reconnect events. Pass the store's dispatch to use the recommended defaults, or provide a custom handler for finer control. |
buildCreateApi | |
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. |
connect | connect() wraps a React component with access to selected Redux state and dispatchable actions. It remains supported, but the documentation recommends the hooks API for new code. |
batch | batch groups multiple React updates into one render pass, commonly wrapping several dispatches made outside React. React 18 automatically batches updates, so explicit use is usually unnecessary there. |
shallowEqual | shallowEqual is a React-Redux comparison function for useSelector. It compares top-level fields of selector results, making it useful when a selector returns a new flat object whose field values are unchanged. |
lruMemoize | |
weakMapMemoize | weakMapMemoize is the default Reselect memoizer used by current Redux Toolkit selectors. It caches results for every distinct argument set by reference, with object-keyed entries eligible for garbage collection and no configurable cache-size limit. |
createSelectorCreator | Creates a customized createSelector factory by choosing the memoization function used for selector result functions. It accepts either a memoizer with optional configuration arguments or an options object. |
extraReducers | extraReducers lets a Redux Toolkit slice respond to actions defined outside its own reducers field. It registers handlers without generating additional action creators or action types. |
createDraftSafeSelectorCreator | Creates a customized, draft-safe selector factory by applying a chosen memoization function. Selectors from that factory work with both ordinary state and Immer drafts. |
Hook
| Name | What it does |
|---|---|
useSelector | useSelector lets a React component read a selected value from the Redux store. It subscribes the component to store updates and returns the selector's result. |
useDispatch | useDispatch returns the Redux store's dispatch function for use in React components. Call the returned function with actions; in TypeScript, prefer a pre-typed wrapper when middleware adds dispatch capabilities. |
useStore | |
useAppSelector | |
useAppDispatch | useAppDispatch is a pre-typed useDispatch hook for Redux applications written in TypeScript. It exposes the store dispatch function with the middleware-aware AppDispatch type. |
createDispatchHook | Creates a useDispatch hook tied to a specified React-Redux context. Use it with a Provider configured with that same context to dispatch actions through the corresponding store. |
createSelectorHook | createSelectorHook creates a useSelector-compatible hook bound to a custom React context. Use the returned hook with a Provider configured with that same context to select store data in components. |
createStoreHook | createStoreHook creates a useStore-style hook bound to a specified React context. Use it when custom React-Redux hooks must read the store from a Provider configured with that context. |
Type Alias
| Name | What it does |
|---|---|
PayloadAction | PayloadAction<T> is a Redux Toolkit TypeScript type for describing an action whose payload has type T. Use it on slice reducer action parameters to type payload access and the generated action creator's argument. |
Slice | createSlice defines a feature's state and case reducers, then generates its reducer, action creators, and action types. It is Redux Toolkit's standard way to package Redux logic for one slice of state. |
Reducer | A reducer is a pure function that maps current state and an action to the next state. Redux Toolkit commonly creates reducers with createSlice, where Immer enables concise immutable update logic. |
Action | |
ThunkAction | ThunkAction is Redux Thunk's generic type for describing thunk functions. It captures the thunk result, state type, injected extra argument, and actions its dispatch can handle. |
ThunkDispatch | ThunkDispatch is a thunk-aware Redux dispatch type. It lets TypeScript accept both ordinary actions and thunk functions, whose execution can access dispatch and state through middleware. |
Middleware | |
Store | Store is the type of a Redux store instance. In TypeScript, derive it from the configured store with typeof store, alongside inferred state and dispatch types. |
EntityState | EntityState<T> is the normalized Redux Toolkit state shape for a collection of entities of type T. It keeps entity IDs in ids and records in the entities lookup. |
EntityAdapter | EntityAdapter is the plain-object adapter type for one normalized entity collection. It bundles CRUD reducers, identity and sorting configuration, initial-state creation, and memoized selector generation. |
AsyncThunk | AsyncThunk is the thunk action-creator type generated by createAsyncThunk. It coordinates a promise-returning payload creator with pending, fulfilled, and rejected lifecycle actions. |
CaseReducer | CaseReducer is a TypeScript function type for describing a reducer that handles a particular state and action shape. Define one outside createSlice when inline reducers become difficult to manage or when reuse is useful. |
ActionReducerMapBuilder | |
SerializedError | SerializedError is Redux Toolkit’s plain, serializable representation of an error. It optionally carries the error name, message, stack, and code. |
Draft | Draft is the Immer-wrapped state received by Redux Toolkit case reducers. You can write mutation-style updates against it, while Immer generates the immutable state result. |
WritableDraft | |
Selector | |
TypedUseSelectorHook | TypedUseSelectorHook is a React-Redux type for creating an application-specific, pre-typed useSelector hook. Supplying RootState gives selectors the store-state type and avoids repeating state annotations. |
EnhancedStore | |
ConfigureStoreOptions | ConfigureStoreOptions is the options type for configureStore. It specifies reducers and optional middleware, enhancers, preloaded state, DevTools configuration, and duplicate-middleware checking. |
BaseQueryFn | |
EndpointBuilder | |
MutationDefinition | MutationDefinition is the TypeScript shape of an RTK Query mutation endpoint. It types the request argument, result, base query, tags, reducer path, context, and endpoint behavior. |
QueryDefinition | |
TagDescription | |
RootState | |
AppDispatch | AppDispatch is the store-specific TypeScript type for Redux dispatch. Derive it from typeof store.dispatch so middleware-provided capabilities, including thunk dispatching, are represented. |
Update | |
EntityId | EntityId is Redux Toolkit's type for an entity identifier. It is defined as number | string, covering numeric and textual IDs used by normalized entity state. |
Comparer | |
IdSelector | IdSelector<T> describes a function that extracts an entity's unique EntityId from a model. It is used by createEntityAdapter, with entity.id as the default extraction rule. |
ListenerEffect | ListenerEffect is the callback type for Redux Toolkit listener entries. It receives the matching action and a listener API, and may run synchronous or asynchronous reactive logic. |
TypedStartListening | TypedStartListening describes a pre-typed listener-middleware startListening function. It lets listener effects use the application's RootState, AppDispatch, and optional extra-argument types instead of unknown or generic types. |
Module
| Name | What it does |
|---|---|
builder.addCase | |
builder.addMatcher | Registers a reducer for actions selected by a custom matcher function. Matching reducers run in declaration order, after exact cases and before a default case. |
builder.addDefaultCase | builder.addDefaultCase registers a fallback reducer for actions not handled by a specific case or matcher. It is used in the builder callback passed to createReducer and can be chained with other builder methods. |
adapter.addOne | adapter.addOne is a generated Redux Toolkit reducer for inserting one entity into normalized entity state. It adds the entity only when its ID is not already present and can be used directly as a case reducer or as an Immer helper. |
adapter.addMany | createEntityAdapter.addMany inserts multiple entities into normalized Redux state, accepting either an array or an ID-keyed record. It skips entities whose IDs already exist. |
adapter.setOne | setOne adds one entity to a createEntityAdapter state, or replaces the existing entity with the same ID. It accepts either a complete entity or an action carrying one. |
adapter.setMany | adapter.setMany adds or replaces multiple entities in a normalized entity-adapter state. It accepts either an array of entities or an ID-keyed record. |
adapter.setAll | adapter.setAll replaces an entity adapter's entire normalized collection with supplied entities. It accepts either an array or an ID-keyed record and is commonly used inside Redux Toolkit slice reducers. |
adapter.updateOne | adapter.updateOne changes one existing entity in a normalized Redux Toolkit entity state. It identifies the entity with id and shallowly applies the fields in changes. |
adapter.updateMany | adapter.updateMany applies partial, shallow updates to multiple entities in a normalized entity state. Each update targets an ID and supplies changed fields through changes. |
adapter.upsertOne | upsertOne inserts one entity when its ID is absent, or shallowly merges its fields into the existing entity with that ID. It is generated by createEntityAdapter and can be used as an adapter operation or slice reducer. |
adapter.upsertMany | adapter.upsertMany inserts multiple entities into normalized state and shallowly merges entities whose IDs already exist. It accepts an array or an ID-keyed record. |
adapter.removeOne | adapter.removeOne removes one entity from an entity adapter's normalized state by ID. It can be used directly as a case reducer or called as an adapter helper. |
adapter.removeMany | removeMany is a generated entity-adapter reducer that removes all entities matching a supplied array of IDs. Use it directly as a slice/reducer case or call it as an Immer helper inside reducer logic. |
adapter.removeAll | |
adapter.getSelectors | adapter.getSelectors generates memoized selectors for a normalized entity state. An optional input selector lets those selectors accept the complete Redux state instead of the entity state directly. |
adapter.getInitialState | adapter.getInitialState creates a normalized entity state with ids and entities. It can merge additional slice fields and optionally populate the state with initial entities. |
listenerMiddleware.startListening | Registers a listener entry on Redux Toolkit listener middleware. The supplied effect runs when exactly one configured action or state predicate matches, and the returned function removes that listener. |
listenerMiddleware.stopListening | Removes a registered listener entry from Redux Toolkit listener middleware. It can optionally cancel active instances and reports whether a matching subscription was found. |
Search across every package and filter by type in your dashboard.
Start learning