Stap 3

Richt je op het maken van een reducer om verzonden acties af te handelen en de doelenstatus in de Redux-store bij te werken. Reducers zijn pure functies die specificeren hoe de status moet veranderen als reactie op acties.

Voorbeeld

Uitdaging

1. Open het bestand goalReducer.js.
2. Maak de reducer aan met behulp van de functie createReducer uit het pakket @reduxjs/toolkit. Deze functie vereenvoudigt het proces van het maken van reducers.
3. Stel de initiële status van de doelen in op een lege array ([]).
4. Specificeer binnen de functie createReducer de gevallen voor verschillende acties met behulp van de acties die zijn aangemaakt in het bestand goalAction.js.
5. Gebruik voor het toevoegen van een doel de methode .addCase en geef de actie addGoal als eerste argument mee. Werk in de bijbehorende callbackfunctie de status bij door de action.payload (het doel) toe te voegen aan de statusarray.
6. Gebruik voor het verwijderen van een doel de methode .addCase en geef de actie removeGoal als eerste argument mee. Werk in de bijbehorende callbackfunctie de status bij door een nieuwe array te retourneren waarin het doel met de overeenkomende goal.id uit de statusarray is gefilterd.

1. De functie createReducer vereenvoudigt het proces van het maken van reducers door een handige syntaxis te bieden.
2. Gebruik de methode .addCase van het builder-object om de gevallen voor verschillende acties te specificeren.
3. Toegang tot de payload van de actie via action.payload.