Kursinhalt
Redux Toolkit & React
Redux Toolkit & React
2. Redux Toolkit in der Praxis
Redux Toolkit Zusammenfassung
Redux Toolkit ist eine leistungsstarke Bibliothek, die das Verwalten des Zustands in React-Anwendungen mit Redux vereinfacht. Hier ist eine Zusammenfassung der wichtigsten Themen im Zusammenhang mit Redux Toolkit:
Redux Store
- Der Redux Store dient als die einzige Quelle der Wahrheit für den Zustand der Anwendung;
- Die
configureStore
-Funktion von Redux Toolkit vereinfacht die Konfiguration des Stores, indem sie sinnvolle Standardwerte und integrierte Middleware bereitstellt; - Die Store-Konfiguration umfasst die Angabe von Reducern für verschiedene Zustandsänderungen.
Redux Store in die App
- Die
Provider
-Komponente aus der Bibliothek react-redux wird verwendet, um den Redux-Store den Komponenten in der App verfügbar zu machen; - Die
Provider
-Komponente umschließt die Root-Komponente der App und akzeptiert den Redux-Store als Prop.
Aktionen und Aktions-Ersteller
- Aktionen beschreiben die Änderungen, die am Zustand vorgenommen werden müssen, und werden mithilfe von Aktions-Erstellern erstellt;
- Redux Toolkit bietet die Funktion
createAction
, um die Erstellung von Aktions-Erstellern zu vereinfachen; - Aktions-Ersteller generieren Aktionsobjekte mit einer Typ-Eigenschaft, die die Aktion beim Dispatch identifiziert.
Reducer und Zustandsverwaltung
- Reducer geben an, wie sich der Zustand als Reaktion auf gesendete Aktionen ändern soll;
- Die Funktion
createReducer
von Redux Toolkit vereinfacht die Erstellung von Reducern, indem sie automatisch Aktionsfälle basierend auf bereitgestellten Funktionen generiert; - Reducer nehmen den aktuellen Zustand und eine Aktion als Parameter und geben den neuen Zustand zurück.
Verbinden von Redux und React
- Der
useSelector
Hook vonreact-redux
greift auf Zustandswerte aus dem Redux-Store in React-Komponenten zu; - Der
useDispatch
Hook wird verwendet, um auf die Dispatch-Funktion zuzugreifen, die das Versenden von Aktionen zur Aktualisierung des Redux-Stores ermöglicht; - Komponenten können sich mit diesen Hooks beim Zustand anmelden und Aktionen versenden, wodurch sie mit dem Redux-Store interagieren können.
Hinweis
Großartig! Sie haben die Grundlagen des Redux Toolkits abgedeckt, einschließlich der Erstellung von Aktionen, Reducern und dem Redux-Store.
Für weitere Unterstützung wird empfohlen, die offizielle Redux Toolkit Dokumentation zu konsultieren. Viel Spaß beim Redux-ing!
1. Was ist der Zweck des Redux-Stores in einer React-Anwendung?
2. Wie wird der Redux-Store den Komponenten in einer React-App zur Verfügung gestellt?
3. Was sind Aktionen in Redux und wie werden sie erstellt?
4. Was ist die Rolle von Reducern in Redux?
5. Wie kann man in React-Komponenten auf Zustandswerte aus dem Redux-Store zugreifen?
War alles klar?
Danke für Ihr Feedback!
Abschnitt 3. Kapitel 7