Reputation: 9858
I am adding the component dynamically with the help of require.ensure()
of ES6 and the getComponent()
of the react-router
. I am getting the above error once I am opening separate tab for the each record having the same key for example "A". My dynamic Loading is like this:
require.ensure([], (require) => {
const req = require('./components/A).default
const reducer= require('./modules').default
injectReducer(store, {
key: 'A',
reducer
})
cb(null, req)
})
My code for the createstore()
is like this:
export const makeRootReducer = (asyncReducers) => {
return combineReducers({
B,
C,
...asyncReducers
})
}
export const injectReducer = (store, { key, reducer }) => {
if (Object.hasOwnProperty.call(store.asyncReducers, key))return
store.asyncReducers[key] = reducer
store.replaceReducer(makeRootReducer(store.asyncReducers))
}
Now the issue is that on browser tab opening except the first time it is showing the warning as:
Unexpected key " A" found in previous state received by the reducer Expected to find one of the known reducer keys instead: "B", "C". Unexpected keys will be ignored.
If I will pass initially Key 'A' combineReducers()
then this warning will go off. But this combineReducers()
is global and it will keep the state of the reducers so that I don't want to pass this Key on the initial load. How can I solve this warning please assist me.
Upvotes: 3
Views: 9922
Reputation: 4174
I came across this problem today, as there seems to be no answer I'll give what worked for me.
This error came up when I was setting an initialState with the createStore function. I didn't have any reducers which matched the initial state tree layout which was meant redux was ignoring some of my initial state. This seems to only be the case for first level keys in the tree though, it seems happy to let nested keys through.
So if you're getting this, make sure your initialState and reducers have a matching tree. This is also describe in the createStore documentation.
Upvotes: 11