React Redux意外密钥传递给创建商店

Question

我收到了错误 Unexpected key "characters" found in initialState argument passed to createStore. Expected to find one of the known reducer keys instead: "marvelReducer", "routing". Unexpected keys will be ignored.

rootReducer:

 import { combineReducers } from 'redux';
 import { routerReducer } from 'react-router-redux';
 import marvelReducer from './marvelReducer';

 const rootReducer = combineReducers({
   marvelReducer,
   routing: routerReducer
 });
 export default rootReducer;

marvelReducer:

import { FETCH_MARVEL } from '../constants/constants';
import objectAssign from 'object-assign';

export default function marvelReducer(state = [], action) {
  switch (action.type) {
    case FETCH_MARVEL:
      return objectAssign({}, state, {characters: action.data});

    default:
      return state;
  }
}

商店:

import { createStore } from 'redux';
import { syncHistoryWithStore } from 'react-router-redux';
import { browserHistory } from 'react-router';

import rootReducer from '../reducers/index';

const initialState = {
  characters: []
};

const store = createStore(rootReducer, initialState);

export const history = syncHistoryWithStore(browserHistory, store);

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

export default store;

我在另一个应用程序中有非常相似的代码,它工作正常.不知道这里发生了什么

Answer 1

您设置为商店的初始状态与您告诉商店预期商店的初始状态应该是什么之间存在小的不匹配,例如 - 更新商店的初始状态设置:

const initialState = {
   marvel: {
     characters: []
   }
};

并且最好将状态树变量持有者命名为有意义的名称,其中不包含reducer,所以更新

const rootReducer = combineReducers({
   marvelReducer,
   routing: routerReducer
});

至

const rootReducer = combineReducers({
   marvel: marvelReducer,
   routing: routerReducer
});

这应该为你做的伎俩.

希望这可以帮助,

PS.一些文档.

来自文档:

如果使用combineReducers生成reducer,则它必须是一个普通对象,其形状与传递给它的键相同.否则,您可以自由地传递减速器可以理解的任何内容.

如果您不需要处理与oneor 相关的任何操作two,只需将它们拉入最初,这可能就像这样简单

export default combineReducers({
  events,
  flash,
  one: (state = {}) => state,
  two: (state = {}) => state
})