javascript - Why is this action.type not firing in the Reducer of my ReactRedux App? - Stack Overflow

admin管理员组

文章数量:1401614

totally stumped, I have an action which sets a state - isAuthenticated boolean and user object based on whether a user is logged in or not.

The action is definitely firing, the auth reducer is correctly running, but the case isn't being triggered so the state isn't updated:

Action:

export const SET_CURRENT_USER = 'SET_CURRENT_USER'

export function setCurrentUser (user) {
  console.log(SET_CURRENT_USER)
  return {
    type: SET_CURRENT_USER,
    user
  }
}

Reducer

import isEmpty from 'lodash/isEmpty'
import SET_CURRENT_USER from '../actions/authActions'

const INITIAL_STATE = {
  isAuthenticated: false,
  user: {}
}

export default function (state = INITIAL_STATE, action) {

      // console.log('action.type = ', action.type) <<< This is outputting the correct action type: SET_CURRENT_USER
      switch (action.type) {
        case SET_CURRENT_USER:
          console.log('set cur user reducer') // this is not running
          console.log(!isEmpty(action.user)) // this is not running
          return {
            isAuthenticated: !isEmpty(action.user),
            user: action.user
          }
        default:
          return state
      }
    }

UPDATE The action is being called on login, and also in the root index.js file with:

store.dispatch(setCurrentUser(jwt.decode(localStorage.getItem('token'))))

Store setup is as follows: Index.js:

const store = configureStore()

configureStore.js:

import { createStore, applyMiddleware } from 'redux'
import thunk from 'redux-thunk'

import rootReducer from './reducers/index'

const configureStore = () => {
  const store = createStore(
    rootReducer,
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__(),
    applyMiddleware(thunk)
  )
  return store
}

export default configureStore

Root Reducer:

import { bineReducers } from 'redux'
import { routerReducer } from 'react-router-redux'

import auth from './auth'
import transactions from './transactions'
import expenditure from './expenditure'
import ine from './ine'

const rootReducer = bineReducers({
  auth,
  transactions,
  expenditure,
  ine,
  routing: routerReducer
})

export default rootReducer

totally stumped, I have an action which sets a state - isAuthenticated boolean and user object based on whether a user is logged in or not.

The action is definitely firing, the auth reducer is correctly running, but the case isn't being triggered so the state isn't updated:

Action:

export const SET_CURRENT_USER = 'SET_CURRENT_USER'

export function setCurrentUser (user) {
  console.log(SET_CURRENT_USER)
  return {
    type: SET_CURRENT_USER,
    user
  }
}

Reducer

import isEmpty from 'lodash/isEmpty'
import SET_CURRENT_USER from '../actions/authActions'

const INITIAL_STATE = {
  isAuthenticated: false,
  user: {}
}

export default function (state = INITIAL_STATE, action) {

      // console.log('action.type = ', action.type) <<< This is outputting the correct action type: SET_CURRENT_USER
      switch (action.type) {
        case SET_CURRENT_USER:
          console.log('set cur user reducer') // this is not running
          console.log(!isEmpty(action.user)) // this is not running
          return {
            isAuthenticated: !isEmpty(action.user),
            user: action.user
          }
        default:
          return state
      }
    }

UPDATE The action is being called on login, and also in the root index.js file with:

store.dispatch(setCurrentUser(jwt.decode(localStorage.getItem('token'))))

Store setup is as follows: Index.js:

const store = configureStore()

configureStore.js:

import { createStore, applyMiddleware } from 'redux'
import thunk from 'redux-thunk'

import rootReducer from './reducers/index'

const configureStore = () => {
  const store = createStore(
    rootReducer,
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__(),
    applyMiddleware(thunk)
  )
  return store
}

export default configureStore

Root Reducer:

import { bineReducers } from 'redux'
import { routerReducer } from 'react-router-redux'

import auth from './auth'
import transactions from './transactions'
import expenditure from './expenditure'
import ine from './ine'

const rootReducer = bineReducers({
  auth,
  transactions,
  expenditure,
  ine,
  routing: routerReducer
})

export default rootReducer

• javascript
• reactjs
• redux

Share Improve this question Follow edited Mar 7, 2017 at 12:07 Le Moi asked Mar 7, 2017 at 12:00 Le MoiLe Moi 1,02533 gold badges1616 silver badges4141 bronze badges 7

• can you do a console log for SET_CURRENT_USER also ? – Arshabh Agarwal Commented Mar 7, 2017 at 12:03
• Hey @ArshabhAgarwal - yes I did that, correctly outputs the action type string. – Le Moi Commented Mar 7, 2017 at 12:04
• How're you setting up the reducer? Do you have the store config code? – Tom Walters Commented Mar 7, 2017 at 12:05
• Hey @TomWalters - yep will update post – Le Moi Commented Mar 7, 2017 at 12:06
• BTW, you should return a new copy of the state instead, you might usually want to do return Object.assign({}, state, { isAuthenticated: !isEmpty(action.user), ... }) – Facundo La Rocca Commented Mar 7, 2017 at 12:08

 |  Show 2 more ments

1 Answer 1

Sorted by: Reset to default 12

it is not exported as default so should be imported using curly braces

import { SET_CURRENT_USER } from '../actions/authActions'

本文标签： javascriptWhy is this actiontype not firing in the Reducer of my ReactRedux AppStack Overflow