This error occurs when a Redux reducer returns undefined instead of a valid state. It's a common mistake in Redux applications that can be fixed by ensuring reducers always return a defined state, even for unrecognized actions.
Fixes Reducer returned undefined after action, check your action type
function myReducer(state = initialState, action) {
switch (action.type) {
case 'SOME_ACTION':
return { ...state, ...action.payload };
default:
return state; // Always include this default case
}
}function myReducer(state = initialState, action) {switch (action.type) {case 'SOME_ACTION':return { ...state, ...action.payload };default:return state; // Always include this default case}}Reducer returned undefined after action, check your action type
The "Reducer returned undefined" error happens when a Redux reducer function does not return a proper state value for a dispatched action. Redux requires that reducers always return a defined state object. This error typically indicates that the reducer is missing a default case in a switch statement or has an early return statement that doesn't provide a state value.
Ensure every reducer has a default case that returns the current state:
function myReducer(state = initialState, action) {
switch (action.type) {
case 'SOME_ACTION':
return { ...state, ...action.payload };
default:
return state; // Always include this default case
}
}Check each case in your switch statement to ensure it returns a proper state value:
// Incorrect - missing return
case 'UPDATE_DATA':
state.data = action.data; // This doesn't return!
break;
// Correct - returns new state
case 'UPDATE_DATA':
return { ...state, data: action.data };Use ES6 default parameters to ensure the reducer always has an initial state:
// Good - provides default initial state
function reducer(state = { count: 0 }, action) {
// reducer logic
}
// Also acceptable - explicit check
function reducer(state, action) {
if (state === undefined) {
return { count: 0 };
}
// rest of reducer
}If using combineReducers, ensure all slice reducers follow the rules:
import { combineReducers } from 'redux';
const rootReducer = combineReducers({
todos: todosReducer, // Must never return undefined
visibility: visibilityFilterReducer // Must never return undefined
});
// Each reducer must handle undefined state by returning initial state
function todosReducer(state = [], action) {
// ...
}Install Redux DevTools extension and inspect the action that causes the error:
1. Open browser DevTools
2. Go to Redux tab
3. Check which action triggered the error
4. Examine the reducer handling that action
This helps identify exactly which reducer is returning undefined.
Redux's combineReducers utility performs a development check that throws this error when any slice reducer returns undefined. This is a safety feature to catch common mistakes early. In production builds, this check may be omitted for performance, but the underlying issue could still cause bugs. Always ensure reducers are pure functions that never return undefined, mutate state, or have side effects.