0

My first try on working with useReducer() on a calculator mini-project. But is throws an error whenever I try clicking on buttons:

console errors

line 136 (const inside App function) in my code looks alright?

function App() {
  const [{ currentOperand, previousOperand, operation }, dispatch] = useReducer(
    reducer,
    {}
  )

I'm using reducer function here with switch statements for math operations

function reducer(state, { type, payload }) {switch(type)...}

dispatch is used on buttons like this

<DigitButton digit = "0" dispatch={dispatch}/>

and the exported component of buttons

export default function DigitButton ({ dispatch, digit }) {
 return <button className="btn" onClick = {() => dispatch({ type: actions.add_digit, payload: { digit}})}>{digit}</button>
};

and the imports are here just in case

import { useReducer } from 'react'
import DigitButton from './DigitButton'
import OperationButton from './OperationButton'
import './App.css'

I'm a beginner so I'm totally lost and can't figure what even might be the problem.

Codesandbox link

Moritz Ringler
  • 9,772
  • 9
  • 21
  • 34
keyc9
  • 15
  • 5
  • please come with a working snippet, if you have a snippet that shows your problem clearly, it will solve your problem much faster compare to come without a snippet, for example, you can create a snippet from code sandbox – Nisharg Shah Feb 22 '23 at 20:02
  • Thanks for the advice, I'm new to asking questions so didn't think of it I've updated the link – keyc9 Feb 22 '23 at 21:16
  • 1
    You don't have a default case in your switch and your reducer is returning `undefined` – Konrad Feb 22 '23 at 21:42

0 Answers0