web-dev-qa-db-fra.com

Réaction de la clé inattendue passée par Redux pour créer le magasin

Je reçois l'erreur 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;
  }
}

le magasin : 

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;

J'ai un code très similaire dans une autre application et cela fonctionne bien. Pas sûr de ce qui se passe ici

javascriptreactjsredux
11
erichardson30

Il existe une petite différence entre ce que vous définissez comme état initial du magasin et ce que vous indiquez au magasin de ce qu'il devrait être de l'état initial du magasin, par exemple. - mettez à jour votre réglage d'état initial pour le magasin en tant que tel: 

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

Et aussi, c'est une bonne idée de nommer les détenteurs de variables de votre arbre d'état en noms significatifs qui ne contiennent pas de réducteur, alors mettez à jour 

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

à 

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

Et cela devrait faire l'affaire pour vous.

J'espère que cela t'aides,

PS certains docs.

De les docs :

Si vous avez produit réducteur avec combineRéducteurs, il doit s'agir d'un objet simple ayant la même forme que les clés qui lui ont été transmises. Sinon, vous êtes libre de passer tout ce que votre réducteur peut comprendre.

Si vous n’avez pas besoin de gérer d’actions liées à one ou two, insérez-les simplement au début, cela pourrait être aussi simple que

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

J'ai le même problème et je ne peux suivre la logique d'aucune de ces solutions potentielles.

Les arguments de combineReducers sont des références à des objets réducteurs, et non à des clés d'état. L'erreur clé est aussi cryptique que la plupart des autres erreurs redux, et même la plupart des réponses ou des solutions potentielles qui leur sont proposées.

0
stevematdavies