Search code examples
reduxreact-redux

TypeError: Cannot read properties of undefined (reading 'type')-redux reducer


the index.js for reducers:

import { combineReducers } from "redux";
import authedUser from "./authedUser";
import users from "./users"
import tweets from './tweets';

export default combineReducers({
    authedUser,
    users,
    tweets
})

the store:

 import React from 'react'
    import ReactDOM from 'react-dom'
    import './index.css'
    import App from './components/App'
    import {createStore,applyMiddleware} from 'redux'
    import {createLogger} from 'redux-logger'
    import {Provider} from 'react-redux'
    import reducer from './reducers'
    import middleware from './middleware'
    import logger from 'redux-logger'
    
    const store = createStore(
        middleware,
        reducer,
        applyMiddleware(logger)
      )
    ReactDOM.render(
    <Provider store={store}>
    <App />
    </Provider>, document.getElementById('root'))

the action related to the error:

export const SET_AUTHED_USER = 'SET_AUTHED_USER'

export function setAuthedUser (id) {
  return {
    type: SET_AUTHED_USER,
    id,
  }
} 

the reducer:

import { SET_AUTHED_USER } from '../actions/authedUser'

export default function authedUser (state = null, action) {
  switch (action.type) {
    case SET_AUTHED_USER :
      return action.id
    default :
      return state
  }
}

The previous state received by the reducer has unexpected type of "Function". Expected argument to be an object with the following keys: "authedUser", "users", "tweets"

enter image description here


Solution

  • Isn't this because you're passing args to createStore in the wrong order?

    The first arg should be the reducer. The second arg is initial state. Since you're passing reducer as initial state, that's why you're seeing the error that previous state is type Function.

    https://redux.js.org/api/createstore