reduxStore没有有效的reduce-coffeescript

redux Store does not have a valid reducer coffeescript

本文关键字：reduce-coffeescript 有效 reduxStore      更新时间：2023-09-26

第一次使用Redux时，我理解Actions和Reducers的概念，但无法让它们在我的代码中很好地发挥作用，我担心这是因为我使用的是CoffeeScript而不是ES6。

我认为问题是我不能在我的/app/reducers/index.coffee中执行export default ...，但老实说，Redux对我来说是非常新的，我在webpack和反应方面已经有一段时间了，但仍然不是最舒服的，所以''_(ツ)_/

我一直收到错误：

Store does not have a valid reducer. Make sure the argument passed to combineReducers is an object whose values are reducers.

/app/actions/index.coffee:

{ FETCH_ITEMS, FETCH_SINGLE_ITEM } = require('../constants')
fetch_items = ->
  { type: FETCH_ITEMS }

fetch_single_item = (id) ->
  {
    type: FETCH_SINGLE_ITEM,
    id: id
  }
module.exports = { fetch_items, fetch_single_item }

/app/reducers/items.咖啡:

$ = require('jquery')
{ FETCH_ITEMS, FETCH_SINGLE_ITEM } = require('../constants')
{ fetch_items } = require('../actions')
INITIAL_STATE = []
items = (state=INITIAL_STATE, action) ->
  console.log action.type
  switch action.type
    when FETCH_ITEMS
      console.log 'FETCH_ITEMS'
      $.get "http://dosomething.com/items", (resp) ->
        console.log resp
    when FETCH_SINGLE_ITEM
      console.log 'do something'
    else
      console.log "suckit turk!"
  state
module.exports = { items }

/app/reducers/index.coffee:

{ combineReducers } = require('redux')
items = require('./items')
reducers = combineReducers({ items })
module.exports = { reducers }

最后/app/index.cjsx

React        = require("react")
ReactDOM     = require("react-dom")
{
  createStore,
  combineReducers,
  appyMiddleware
} = require('redux')
{ reducers } = require("./reducers/")
STORE = createStore combineReducers({ reducers, routing: routerReducer     })
HISTORY = syncHistoryWithStore(browserHistory, STORE)
STORE.subscribe () ->
  console.log STORE.getState()
...omitted react render: ->...

编辑

对不起，大家，是的，routeReducer已经定义好了，我只是省略了它，因为我很确定这不是问题所在。

/app/index.cjsx

React        = require("react")
ReactDOM     = require("react-dom")
{
  createStore,
  combineReducers,
  appyMiddleware
} = require('redux')
{
  syncHistoryWithStore,
  routerReducer
} = require('react-router-redux')

{ reducers } = require("./reducers/")
STORE = createStore combineReducers({ reducers, routing: routerReducer     })
HISTORY = syncHistoryWithStore(browserHistory, STORE)
STORE.subscribe () ->
  console.log STORE.getState()
...omitted react render: ->...

减速器必须：

  1. 接收状态和操作作为参数
  2. 始终返回相同或新状态

您的"；减速器"；items仅在switch语句中的所有事例都不匹配的情况下才返回状态，这意味着它不是一个有效的reducer。如果在执行其中一个操作时遇到此错误，redux可能会检测到尚未返回新状态。看看在将items制成合适的减速器后，您是否还会遇到这个问题。

旁注

您正在从items reducer进行异步API调用，并且您的存根代码看起来像是计划添加第二个。这不是减速器的正确使用；存储应该保存与应用程序状态相关的数据，reducer应该在给定旧状态和操作类型和/或有效负载的情况下制造新状态。

相反，在一个"；动作创建者"；。（参见文档）

像fetch_items这样的动作创建者将执行AJAX请求，并在成功时触发set_items动作的调度，例如{ type: 'SET_ITEMS', payload: [...response.items...] }。您的reducer将侦听SET_ITEMS操作，并返回一个新状态，该状态已使用有效负载更新。

相关文章：