useReducer in React
From the React Hooks cheat sheet · State & Updates · verified Jul 2026
useReducer
Complex state logic with actions
javascript
// Define reducer
const reducer = (state, action) => {
switch (action.type) {
case 'increment': return { count: state.count + 1 }
case 'decrement': return { count: state.count - 1 }
case 'reset': return initialState
default: throw new Error()
}
}
// Use in component
const [state, dispatch] = useReducer(reducer, { count: 0 })
dispatch({ type: 'increment' })✅ Better than useState for complex logic
💡 Actions make state changes predictable
⚡ Great for forms with many fields
Continue with React Hooks
Save the full cheat sheet or work through every related task.