redux reducer不是函数

eqfvzcg8  于 12个月前  发布在  其他
关注(0)|答案(4)|浏览(137)

尝试创建reducers ang从行动中获取数据
但是在控制台中得到错误: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;
    }

字符串
我哪里错了?
我的行动:

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


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

export function IncomeList () {

    return dispatch => {

        return (

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

                dispatch(receiveData(response.data));

            })

            )
    }
}


如何正确的方式创建减速机呢?

relj7zay

relj7zay1#

看起来你从来没有导出过你的reducer。你的listReducer.js文件中的export default listReducer应该可以做到这一点。

mdfafbf1

mdfafbf12#

  • 商店-持有我们的状态-只有一个状态
  • Action -可以使用actions - SIMPLE PROTECTS修改状态
  • Dispatcher -操作需要由某人发送-称为调度操作
  • Reducer -接收操作并修改状态以给予新的状态
    • 纯函数
    • 唯一的强制参数是'type'
  • 订阅服务器-侦听状态更改以更新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>
        );
    }
}

字符串

ukxgm1gy

ukxgm1gy3#

在我的例子中,我立即调用了该函数

const store = createStore(rootReducer())

字符串
而不是

const store = createStore(rootReducer)

ghhaqwfi

ghhaqwfi4#

它为我工作,停止节点(Ctrl + C)并重新启动它(npm start),重新加载页面(F5),你会看到新的结果。

相关问题