Steg 3

Fokusera på att skapa en reducer för att hantera distribuerade actions och uppdatera måltillståndet i Redux store. Reducers är rena funktioner som specificerar hur tillståndet ska förändras som svar på actions.

Exempel

Utmaning

1. Öppna filen goalReducer.js.
2. Skapa reducern med hjälp av funktionen createReducer från paketet @reduxjs/toolkit. Denna funktion förenklar processen att skapa reducers.
3. Sätt initialt tillstånd för målen till en tom array ([]).
4. Ange i funktionen createReducer olika fall för actions med hjälp av de actions som skapats i filen goalAction.js.
5. För att lägga till ett mål, använd metoden .addCase och skicka in actionen addGoal som första argument. I motsvarande callback-funktion, uppdatera tillståndet genom att lägga till action.payload (målet) i tillståndsarrayen.
6. För att ta bort ett mål, använd metoden .addCase och skicka in actionen removeGoal som första argument. I motsvarande callback-funktion, uppdatera tillståndet genom att returnera en ny array som filtrerar bort målet med matchande goal.id från tillståndsarrayen.

1. Funktionen createReducer förenklar processen att skapa reducers genom att erbjuda en smidig syntax.
2. Använd metoden .addCase på objektet builder för att ange fall för olika actions.
3. Kom åt actionens payload med action.payload.