Wofür wird React-Redux verwendet?

Die Funktionen von „react-redux“: 1. Teilen Sie Komponenten in Containerkomponenten und UI-Komponenten auf. 2. Ersetzen Sie „store.subscribe“ in Redux, um die Zustandsänderungen von Komponenten zu überwachen und zum Rendern von Komponenten zu verwenden redux, Ermöglichen Sie Komponenten den einfachen Erhalt des globalen Status und erleichtern Sie die Kommunikation zwischen Komponenten.

Die Betriebsumgebung dieses Tutorials: Windows 10-System, Reaktionsversion 17.0.1, Dell G3-Computer.

Was ist der Nutzen von React-Redux?

React-Redux wird in Verbindung mit Redux verwendet. Durch das Einfügen der durch Redux definierten Speicherdaten in die Komponente kann die Komponente problemlos den globalen Status abrufen und die Kommunikation zwischen Komponenten erleichtern. Verbinden Sie das Reaktionspaket mit dem Redux-Rechenzentrum (Store). Nach dem Aufruf der Dispatch-Funktion zum Ändern des Datenstatus wird die Verarbeitungslogik zum Aktualisieren der Ansicht durch Abonnementregistrierung ausgelöst, einschließlich der Daten, die gerendert werden müssen, und der Funktion, die aktualisiert wird die Daten.

Es wird hauptsächlich zum Verpacken von Bauteilen verwendet, die am Eingang Redux erfordern. Im Wesentlichen wird der Laden in den Kontext gestellt.

Da die Kopplung zwischen Redux und Komponenten zu hoch ist, wurde Redux entwickelt, um sie zu entkoppeln. Sobald wir React-Redux einführen, müssen wir das Abonnement des Stores nicht mehr verwenden, um den Status selbst zu abonnieren. UI-Komponenten sind wie gewöhnliche Komponenten ohne Redux. Besser lesbar.

Funktion 1

unterteilt Komponenten in Containerkomponenten und UI-Komponenten verwenden Requisiten, um Status und Betriebsstatus zu erhalten.

Funktion 2

Verwenden Sie die Provider-Komponente als Ersatz für store.subscribe in Redux, um die Zustandsänderungen der Komponente zu überwachen und sie zum Rendern der Komponente zu verwenden.

Funktion 3

Verbinden Sie UI-Komponenten und verbinden Sie sie über die Kern-API. Der erste Parameter empfängt zwei Rückruffunktionen: und dann gibt ein Objektobjekt zurück, das den gewünschten Zustand der UI-Komponente enthält. Rückruffunktion 2: empfängt einen Dispatch und gibt ein Objekt zurück, das die Methode zum Betreiben des Status der UI-Komponente enthält. Es gibt auch eine Kurzmethode, bei der der zweite Parameter direkt an ein Objekt übergeben wird, das Methoden für den Betriebsstatus enthält. (Kern: Zuordnungsstatus und Versand an die Requisiten von UI-Komponenten)

Kerncode

export default connect(
    state => ({count: state}),
    dispatch => {
        return {
            increment: number => dispatch(increment(number)),
            decrement: number => dispatch(decrement(number)),
        }
    }
)(Counter)

Das Folgende ist die Abkürzung

export default connect(
    state => ({count: state}),
    {increment,decrement}
)(Counter)

Empfohlenes Lernen: „Video-Tutorial reagieren“

Das obige ist der detaillierte Inhalt vonWofür wird React-Redux verwendet?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!