CODEWITHSUNDEEP
reactjstypescriptreduxreact-redux
Иннокентий Михайлов
Иннокентий Михайлов

Reputation: 13

Cannot read properties of undefined (reading 'type'). Redux

So, i am trying to setup redux in my project. And there is very strange problem showing up in reducer: Uncaught TypeError: Cannot read properties of undefined (reading 'type'). Here is reducer.ts:

import { MarkerActionEnum, MarkerActions, MarkerState } from './types';

const initialState: MarkerState = {
  data: undefined,
};

export function MarkerReducer(
  action: MarkerActions,
  state = initialState,
): MarkerState {
  switch (action.type) {
    case MarkerActionEnum.ADD_MARKER:
      return {
        ...state,
        data: action.payload,
      };
    case MarkerActionEnum.DELETE_MARKER: {
      return { data: undefined };
    }
    default:
      return state;
  }
}

export default MarkerReducer;

and types.ts for reducer:

import { Action } from 'redux';
import { MarkerType } from '../../pages/mapPage/components/CustomMap';

export interface MarkerState {
  data: MarkerType | undefined;
}

export enum MarkerActionEnum {
  ADD_MARKER = 'marker/ADD_MARKER',
  DELETE_MARKER = 'marker/DELETE_MARKER',
}

export interface AddMarkerInterface
  extends Action<MarkerActionEnum.ADD_MARKER> {
  type: MarkerActionEnum.ADD_MARKER;
  payload: { longitude: number; latitude: number };
}

export interface DeleteMarkerInterface
  extends Action<MarkerActionEnum.DELETE_MARKER> {
  type: MarkerActionEnum.DELETE_MARKER;
}

export type MarkerActions = AddMarkerInterface | DeleteMarkerInterface;

Log says that the problem occurs in line 11 of reducer, right in switch (action.type) Does anyone know or stumbled in something like this?

Upvotes: 0

Views: 3362

Answers (2)

abender
abender

Reputation: 21

I had the same issue. The problem is the ordering of the parameters. "State" should be the first and "action" the second.

Upvotes: 2

JulienD
JulienD

Reputation: 7293

I'd say it means you have used as argument to dispatch something that is not an action, i.e. has no type property. For example if you have an action builder and forgot the parentheses, like in dispatch(myActionBuilder) instead of dispatch(myActionBuilder()).

Upvotes: 0

Related Questions