javascript - reducer is not a function - Stack Overflow

admin管理员组

文章数量:1291013

Try create reducers ang get data from action

But get error in console: reducer is not a function.....

My reducer:

import { INCOME_LIST } from '../actionTypes'

import Immutable from 'immutable'

    const initialUserState = {
      list: []
    }

    const listReducer = function(state = initialUserState, action) {
      switch(action.type) {
      case 'INCOME_LIST':
        return Object.assign({}, state, { list: action.data });
      }
      return state;
    }

Where I have mistake?

My Action :

import axios from 'axios'
import { INCOME_LIST } from '../actionTypes'



function receiveData(json) {
    return{
        type: INCOME_LIST,
        data: json
    }
};


export function IneList () {

    return dispatch => {

        return (

            axios.post('http://139.196.141.166:8084/course/ine/outline',{}, {
      headers: { 'X-Authenticated-Userid': '15000500000@1' }
     }).then(function (response) {

                dispatch(receiveData(response.data));

            })

            )
    }
}

How it right way create reducer for that?

Try create reducers ang get data from action

But get error in console: reducer is not a function.....

My reducer:

import { INCOME_LIST } from '../actionTypes'

import Immutable from 'immutable'

    const initialUserState = {
      list: []
    }

    const listReducer = function(state = initialUserState, action) {
      switch(action.type) {
      case 'INCOME_LIST':
        return Object.assign({}, state, { list: action.data });
      }
      return state;
    }

Where I have mistake?

My Action :

import axios from 'axios'
import { INCOME_LIST } from '../actionTypes'



function receiveData(json) {
    return{
        type: INCOME_LIST,
        data: json
    }
};


export function IneList () {

    return dispatch => {

        return (

            axios.post('http://139.196.141.166:8084/course/ine/outline',{}, {
      headers: { 'X-Authenticated-Userid': '15000500000@1' }
     }).then(function (response) {

                dispatch(receiveData(response.data));

            })

            )
    }
}

How it right way create reducer for that?

• javascript
• reactjs
• redux

Share Improve this question Follow asked Jan 22, 2017 at 14:36 Егор КротенкоЕгор Кротенко 81833 gold badges1414 silver badges3535 bronze badges 2

• Did you export listReducer? – Giladd Commented Jan 22, 2017 at 14:43
• thanks... need export – Егор Кротенко Commented Jan 22, 2017 at 14:47

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 6

Looks like you never exported your reducer. An export default listReducer in your listReducer.js file should do the trick.

• Store - holds our state - THERE IS ONLY ONE STATE
• Action - State can be modified using actions - SIMPLE OBJECTS
• Dispatcher - Action needs to be sent by someone - known as dispatching an action
• Reducer - receives the action and modifies the state to give us a new state
• • pure functions
• • only mandatory argument is the 'type'

• Subscriber - listens for state change to update the ui

  const initialState = {
      counter: 0
  }
  
  const reducer = (state = initialState, action) => {
      switch (action.type) {
          case 'INCREASE_COUNTER':
              return { counter: state.counter + 1 }
          case 'DECREASE_COUNTER':
              return { counter: state.counter - 1 }
      }
      return state
  }
  
  const store = createStore(reducer)
  
  class App extends Component {
  
      render() {
          return (
              <Provider store={store}>
                  <CounterApp />
              </Provider>
          );
      }
  }
  

In my case I called the function immediately

const store = createStore(rootReducer())

instead of

const store = createStore(rootReducer)

It worked for me, Stop node (Ctrl + C) and restart it (npm start), reload the page (F5), you will see new results.

本文标签： javascriptreducer is not a functionStack Overflow