Let's say I have the next reducer:
export default (state = [], { type, payload }) => {
switch (type) {
case FETCH_POKEMONS:
const objeto = {};
payload.forEach((conexion) => {
objeto[conexion.name] = conexion
});
return objeto;
case FETCH_POKEMON:
return { ...state, ...payload }
default:
return state
}
}
And I will have a combineReducers like this:
export default combineReducers({
pokemons: pokemonReducers,
});
But I want to have pokemons
state for the FETCH_POKEMONS
actions and another state called pokemon
for the FETCH_POKEMON
acton. How can I derivate two states in the combineReducers
from one reducer file?
This is anti pattern, the closest thing to do here would be export 2 reducers from your file, one for each use case
export const reducer1 = (state = [], { type, payload }) => {
switch (type) {
case FETCH_POKEMONS:
const objeto = {};
payload.forEach((conexion) => {
objeto[conexion.name] = conexion
});
return objeto;
default:
return state
}
}
export const reducer2 = (state = [], { type, payload }) => {
switch (type) {
case FETCH_POKEMON:
return { ...state, ...payload }
default:
return state
}
}
If I'm understanding your question correctly, you have two actions, FETCH_POKEMONS
and FETCH_POKEMON
, and you want them to update two different states, pokemons
and pokemon
, respectively.
pokemon
and pokemons
, which each manage their own state and then pass those reducers into combineReducers to combine them into a single application-level reducer. I think this is more likely what you're looking for.state.pokemon
with its previous value when performing FETCH_POKEMONS
.If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With