CODEWITHSUNDEEP
javascriptreact-nativereduxreact-reduxredux-toolkit
JasonBeedle
JasonBeedle

Reputation: 469

Reducer is not a function. React Native Redux

I am trying to add a reducer to my react native app. Here is the store constant:

export const USER_PROFILE = 'USER_PROFILE';

Here is the action.js

import {USER_PROFILE} from '../constants/index';

export function userProfile(userReducer) {
  return {
    type: USER_PROFILE,
    payload: {
      email: '',
    },
  };
}

This the userReducer that is causing the error. I keep getting an error of customerReducer is not a function.

import {USER_PROFILE} from '../constants/index';

const initialState = {
  userProfile: '',
};

const customerReducer = (state = initialState, action) => {
  switch (action.type) {
    case USER_PROFILE:
      return {
        ...state,
        userProfile: action.payload,
      };
    default:
      return state;
  }
};

export default customerReducer;

And I have declared the email as a state... const [email, setEmail] useState('')

calling the reducer here. const customerReducer = useSelector(state => state.userProfile); Now dispatching it with the useDispatch method.

const dispatch = useDispatch();
...
dispatch(customerReducer(email));

Upvotes: 0

Views: 850

Answers (1)

Reda Mekhezzem
Reda Mekhezzem

Reputation: 26

Your action.js should look somthing like this:

import {USER_PROFILE} from '../constants/index';

export function userProfile(userReducer) {
  return {
    type: USER_PROFILE,
    payload: {
      email: userReducer.email,
    },
  };

and when you dispatch you should use the action "userProfile" not the reducer "customerReducer". Your dispatch should look somthing like this:

dispatch(userProfile({email}));

make sure to use curly brackets. beacause you should pass an object not a string.

Upvotes: 1

Related Questions