Hola, reductor creado y me pregunto si este es el patrón correcto.
Estoy tratando de:
Me pregunto si estoy en el camino correcto, no quiero mutar, así que aquí está mi código.
export const reducerCharities = ( state: CharityReducerState, action: CharitiesAction | CharityEditAction ) => { switch (action.type) { case ACTION_TYPE_EDIT: return { ...state, charity: { ...state.charity, ...(action.charity || {}), }, charities: [ ...state.charities.map(item => item.id === action.charity?.id ? { ...item, ...action.charity } : item) ] } case ACTION_TYPE: return { ...state, charities: [ ...state.charities || [], ...action.charities ] } default: return state } }Entonces, mi pregunta es si esta parte mutará o ¿hay una mejor manera de escribir esto?
charities: [ ...state.charities.map(item => item.id === action.charity?.id ? { ...item, ...action.charity } : item) ]¿Es este el enfoque correcto para agregar un nuevo elemento a la matriz?
{ ...state, charities: [ ...state.charities || [], ...action.charities ] }La forma más fácil (y recomendada oficialmente desde 2019) de hacer esto sería usar el paquete oficial Redux Toolkit y el método createSlice .
Dentro de eso, puede simplemente mutar y no tiene que preocuparse por las actualizaciones inmutables manuales: el paquete se hace cargo por usted.
El código podría verse como
const charitiesSlice = ({ name: 'charities', initialStae: myInitialState, reducers: { edit(state, action: PayloadAction<Charity>){ const charity = state.charities.find(item => item.id === action.payload.id) if (charity) { Object.assign(charity, action.payload) } state.charity = action.payload } } } export const { edit } = charitiesSlice.actions export const reducerCharities = charitiesSlice.reducer