redux-toolkitcreateAsyncThunkintermediate

Handling Fulfilled State

📖 Usage Example

builder.addCase(loadPosts.fulfilled, (state, action) => {
  state.items = action.payload
  state.loaded = true
})

The fulfilled handler receives the resolved value as action.payload — assign it directly to state with Immer.

The fulfilled action carries the resolved value as action.payload. Use it to store fetched data in your slice.

Challenge: Create a loadPosts thunk and update items and loaded state on fulfillment.

postsSlice.reducer(undefined, loadPosts.fulfilled(['post1','post2'], 'req'))
// → { items: ['post1', 'post2'], loaded: true }

💡 Hints (3)

• `action.payload` in a fulfilled handler is the value returned by your async function.
• With Immer you can write `state.items = action.payload` directly.
• Construct the fulfilled action manually for tests: `loadPosts.fulfilled(payload, requestId)`.

13/22