Tengo este selector en mi aplicación redux todo:
export const selectTodoSlice = (state) => state.todoReducer; Y tengo que nombrar este state.todoReducer de la misma manera que definí mi reducer en la tienda:
import todoReducer from "../features/todo/todoSlice"; const store = configureStore({ reducer: { todoReducer, }, }); ...de lo contrario, obtendré errores sobre algunas funciones .map() .
Entonces, me preguntaba si esto es una convención y la regla de que esta parte de la función de retorno en los selectores, state.todoReducer , siempre debe ser igual que el reductor que nombra y pasa a su tienda.
Cuando pasas { reducer: { todoReducer } } a configureStore, redux crea una propiedad correspondiente en state.
createStore({ reducer: { todoReducer: (state, action) => { ... }, } }) // redux state { todoReducer: { // whatever todoReducer returns } }Obtienes una propiedad en estado por cada propiedad en reducer:
createStore({ reducer: { todoReducer: (state, action) => { ... }, someOtherReducer: (state, action) => { ... } } }) // redux state { todoReducer: { // whatever todoReducer returns }, someOtherReducer: { // whatever someOtherReducer returns } }Su selector está devolviendo una propiedad con nombre del objeto de estado. Si esa propiedad nombrada no existe en el estado, el selector devolverá undefined. Si el código posterior espera una matriz e intenta invocar el mapa en ella, obtendrá errores.
considerar:
const state = { todoReducer: ["one", "two", "three"] } // this works const todo = state.todoReducer; // array const allCaps = todo.map(item => item.toUpperCase()); // ["ONE", "TWO", "THREE"] // this doesn't const notThere = state.nonexistentProperty; // undefined const boom = notThere.map(item => item.toUpperCase()); // error