Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

React Redux: undefined reducer action

I made increment & decrement counter buttons, I’m using redux to trigger actions of increment and decrement but Im getting "Counter.js:11 Uncaught TypeError: Cannot read properties of undefined (reading ‘addition’)" error by clicking the button.

Here is the code:-

store.js

const counterSlice = createSlice({
    name: "counter",
    initialState: {
        countNumber: 0,
        countToggle: true,
    },
    reducers: {
        addition(state) {
            state.countNumber++;
        },
        subtraction(state) {
            state.countReducer--;
        },          
    },
});
const store = configureStore({
    reducer: counterSlice.reducer,
})

export const storeAction = store.actions;

export default store;

Counter.js

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

import { useDispatch, useSelector } from "react-redux";
import { storeAction } from "../redux-store/store";

const counter = useSelector((state) => state.countNumber);
    
const dispatch = useDispatch();

const addHandler = () => {
    dispatch(storeAction.addition());
};

//jsx
<div className={classes.value}>{counter}</div>
<button onClick={addHandler}>addition</button>

>Solution :

Shouldn’t it be?

export const storeAction = counterSlice.actions
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading