Redux 商店没有有效的 reducer答案

【问题标题】：Redux store does not have a valid reducerRedux 商店没有有效的 reducer
【发布时间】：2016-07-24 07:21:27
【问题描述】：

在这里找不到任何关于此错误的信息：

“Store 没有有效的 reducer。确保传递给 combineReducers 的参数是一个其值为 reducer 的对象。”

我的减速器

export default function FriendListReducer(state = {friends : []}, action) {
  switch (action.type) {
    case 'ADD_FRIEND':
      return [
        { friends : action.payload.friend }, ...state.friends
      ]     
    default:
      return state;
  }
  return state;
}

组合器

import { combineReducers } from 'redux';
import { FriendListReducer } from './FriendListReducer';

const rootReducer = combineReducers({
  friends: FriendListReducer
});
export default rootReducer;

我的商店配置

import { applyMiddleware, createStore } from 'redux';
import thunkMiddleware from 'redux-thunk';
import createLogger from 'redux-logger';
import rootReducer from '../reducers/reducers';

export default function configureStore(initialState = { friends: [] }) {
  const logger = createLogger({
    collapsed: true,
    predicate: () =>
    process.env.NODE_ENV === `development`, // eslint-disable-line no-unused-vars
  });

  const middleware = applyMiddleware(thunkMiddleware, logger);

  const store = middleware(createStore)(rootReducer, initialState);

  if (module.hot) {
    // Enable Webpack hot module replacement for reducers
    module.hot.accept('../reducers/reducers', () => {
      const nextRootReducer = require('../reducers/reducers').default;
      store.replaceReducer(nextRootReducer);
    });
  }

  return store;
}

【问题讨论】：

标签： reactjs redux reducers

【解决方案1】：

看起来您的顶级 reducer 函数正在使用数组作为其默认值。 Redux 期望状态的最顶端是一个对象，而不是一个数组。尝试将数组放在该对象中的特定键处，例如 { friendList : [] }。

【讨论】：

您传递给商店的“initialState”值与您使用combineReducers 创建的结构不匹配。您给combineReducers 一个名为FriendListReducer 的字段，但存储初始状态为friends。您需要以一种或另一种方式进行匹配。由于它们不匹配，因此您仍然遇到同样的问题。
我已经更新了代码，仍然出现同样的错误，这里更新了代码

【解决方案2】：

../reducers/reducers ?好奇怪的名字

反正../reducers/reducers 好像没有返回reducer，如果reducers是一个目录，在里面放一个index.js，导入每个reducer并创建一个root reducer

import FriendListReducer from "./FriendListReducer"

const rootReducer = combineReducers({
   friendList : FriendListReducer
})

export default rootReducer

重要！！ 你的状态中会有 state.friendList。

希望对你有帮助

【讨论】：

让我感到困惑的是有几个具有相同名称（索引）的文件。我的组合器在文件夹 reducers 中命名为 reducers.js，它是按照您提到的方式设置的

【解决方案3】：

您的import 语句不正确。您可以将import { Foo } from 'bar' 与export Foo 一起使用，或如果您使用export default Foo 导出，则使用import Foo from 'bar'。

换句话说，将export default function FriendListReducer 更改为export function FriendListReducer，或将导入语句从import { FriendListReducer } 更改为import FriendListReducer。

【讨论】：

【解决方案4】：

如果对象为空。

 export  default  combineReducers({

 })

将显示此错误。

【讨论】：

【解决方案5】：

Please check your combine reducer file It's empty......

you have forgot bind reducer here

import {combineReducers, createStore} from 'redux'
import listDataReducer from '../reducers/ListDataReducer'

const rootReducer = combineReducers({
    listDataReducer,         //  Please add your reducer here
});

export default rootReducer;

【讨论】：

【解决方案6】：

我也遇到了这个问题。我所做的是：

combineReducers(productReducer, cartReducer)

我做到了：

combineReducers({ productReducer, cartReducer })

它奏效了。它需要一个有效的存储对象。

【讨论】：

【解决方案7】：

在您的代码上方

import { FriendListReducer } from './FriendListReducer';

const rootReducer = combineReducers({
  friends: FriendListReducer
});
export default rootReducer;

而不是import { FriendListReducer } from './FriendListReducer';

只要说import FriendListReducer from './FriendListReducer';

因为FriendListReducer 是使用export default FriendListReducer 而不是export const FriendListReducer 导出的

【讨论】：