Support Ukraine 🇺🇦
🇺🇦
Help Provide Humanitarian Aid to Ukraine.
React
Learn
Reference
Community
Blog

    react@18.2.0

  • Hooks
    • useCallback
    • useContext
    • useDebugValue
    • useDeferredValue
    • useEffect
    • useId
    • useImperativeHandle
    • useInsertionEffect
    • useLayoutEffect
    • useMemo
    • useReducer
    • useRef
    • useState
    • useSyncExternalStore
    • useTransition
  • Components
    • <Fragment> (<>)
    • <Profiler>
    • <StrictMode>
    • <Suspense>
  • APIs
    • createContext
    • forwardRef
    • lazy
    • memo
    • startTransition
  • react-dom@18.2.0

  • Components
    • Common (e.g. <div>)
    • <input>
    • <option>
    • <progress>
    • <select>
    • <textarea>
  • APIs
    • createPortal
    • flushSync
    • findDOMNode
    • hydrate
    • render
    • unmountComponentAtNode
  • Client APIs
    • createRoot
    • hydrateRoot
  • Server APIs
    • renderToNodeStream
    • renderToPipeableStream
    • renderToReadableStream
    • renderToStaticMarkup
    • renderToStaticNodeStream
    • renderToString
  • Legacy APIs

  • Legacy React APIs
    • Children
    • cloneElement
    • Component
    • createElement
    • createFactory
    • createRef
    • isValidElement
    • PureComponent

Is this page useful?

API Reference
Hooks

useReducer

useReducer is a React Hook that lets you add a reducer to your component.

const [state, dispatch] = useReducer(reducer, initialArg, init?)
  • Reference
    • useReducer(reducer, initialArg, init?)
    • dispatch function
  • Usage
    • Adding a reducer to a component
    • Writing the reducer function
    • Avoiding recreating the initial state
  • Troubleshooting
    • I’ve dispatched an action, but logging gives me the old state value
    • I’ve dispatched an action, but the screen doesn’t update
    • A part of my reducer state becomes undefined after dispatching
    • My entire reducer state becomes undefined after dispatching
    • I’m getting an error: “Too many re-renders”
    • My reducer or initializer function runs twice

Reference

useReducer(reducer, initialArg, init?)