Herausforderung: Implementieren des Reducers
Schritt 3
Konzentration auf die Erstellung eines Reducers zur Verarbeitung ausgelöster Aktionen und zur Aktualisierung des goals-Status im Redux-Store. Reducer sind reine Funktionen, die festlegen, wie sich der Status als Reaktion auf Aktionen ändern soll.
Beispiel
Herausforderung
- Öffnen der Datei
goalReducer.js
. - Erstellen des Reducers mit der Funktion
createReducer
aus dem Paket@reduxjs/toolkit
. Diese Funktion vereinfacht die Erstellung von Reducern. - Festlegen des Anfangszustands der goals auf ein leeres Array (
[]
). - Innerhalb der Funktion
createReducer
die Fälle für verschiedene Aktionen mit den imgoalAction.js
erstellten Aktionen angeben. - Zum Hinzufügen eines Ziels die Methode
.addCase
verwenden und die AktionaddGoal
als erstes Argument übergeben. Im zugehörigen Callback die Aktualisierung des Status durch das Hinzufügen vonaction.payload
(das Ziel) zum Status-Array durchführen. - Zum Entfernen eines Ziels die Methode
.addCase
verwenden und die AktionremoveGoal
als erstes Argument übergeben. Im zugehörigen Callback den Status aktualisieren, indem ein neues Array zurückgegeben wird, das das Ziel mit der passendengoal.id
aus dem Status-Array herausfiltert.
- Die Funktion
createReducer
vereinfacht die Erstellung von Reducern durch eine komfortable Syntax. - Mit der Methode
.addCase
desbuilder
-Objekts können die Fälle für verschiedene Aktionen angegeben werden. - Auf die Nutzlast der Aktion kann mit
action.payload
zugegriffen werden.
War alles klar?
Danke für Ihr Feedback!
Abschnitt 3. Kapitel 5
Fragen Sie AI
Fragen Sie AI
Fragen Sie alles oder probieren Sie eine der vorgeschlagenen Fragen, um unser Gespräch zu beginnen
Awesome!
Completion rate improved to 4.17
Herausforderung: Implementieren des Reducers
Swipe um das Menü anzuzeigen
Schritt 3
Konzentration auf die Erstellung eines Reducers zur Verarbeitung ausgelöster Aktionen und zur Aktualisierung des goals-Status im Redux-Store. Reducer sind reine Funktionen, die festlegen, wie sich der Status als Reaktion auf Aktionen ändern soll.
Beispiel
Herausforderung
- Öffnen der Datei
goalReducer.js
. - Erstellen des Reducers mit der Funktion
createReducer
aus dem Paket@reduxjs/toolkit
. Diese Funktion vereinfacht die Erstellung von Reducern. - Festlegen des Anfangszustands der goals auf ein leeres Array (
[]
). - Innerhalb der Funktion
createReducer
die Fälle für verschiedene Aktionen mit den imgoalAction.js
erstellten Aktionen angeben. - Zum Hinzufügen eines Ziels die Methode
.addCase
verwenden und die AktionaddGoal
als erstes Argument übergeben. Im zugehörigen Callback die Aktualisierung des Status durch das Hinzufügen vonaction.payload
(das Ziel) zum Status-Array durchführen. - Zum Entfernen eines Ziels die Methode
.addCase
verwenden und die AktionremoveGoal
als erstes Argument übergeben. Im zugehörigen Callback den Status aktualisieren, indem ein neues Array zurückgegeben wird, das das Ziel mit der passendengoal.id
aus dem Status-Array herausfiltert.
- Die Funktion
createReducer
vereinfacht die Erstellung von Reducern durch eine komfortable Syntax. - Mit der Methode
.addCase
desbuilder
-Objekts können die Fälle für verschiedene Aktionen angegeben werden. - Auf die Nutzlast der Aktion kann mit
action.payload
zugegriffen werden.
War alles klar?
Danke für Ihr Feedback!
Abschnitt 3. Kapitel 5