2016-12-15 5 views
0

In der einfachen Reaktion löst setState die render-Methode aus. Nun, über Redux, sagen wir, ich feuere eine Aktion aus, der von den Reducern zurückgegebene Status ist völlig neu, also hört es sich so an, als müsste jede Komponente aktualisiert werden, obwohl ich weiß, dass es nicht wahr ist, wenn ich meine App debugge es, und es klingt wie eine schreckliche Leistung. Meine Frage ist also, sieht redux in jeder Komponente aus, welchen Zustandsausschnitt sie benötigt? in mapStateToProps? und wie entscheidet Redux, wann die Rendermethode aufgerufen werden soll?Komponenten werden in Redux aktualisiert

Ich weiß Redux Optimierungen in sich hat dank ... ...

+0

'total neu' bedeutet nicht eine komplette, tiefe Kopie. Es sei denn, Sie ändern jeden Knoten des Statusbaums. –

Antwort

1

A Redux-Shop bietet eine subscribe() Methode. Wenn Sie connect() verwenden, generiert es Wrapper-Komponenten, die den Speicher automatisch abonnieren, wenn sie erstellt werden. Jede einzelne verbundene Komponente ist ein separater Teilnehmer.

Wenn eine Aktion ausgelöst wird, führt der Informationsspeicher alle Abonnementrückrufe aus. Die Wrapper-Komponenten rufen dann store.getState(). Wenn das Stammzustandsobjekt === identisch mit dem vorherigen ist, wird die Komponente dort als erste Überprüfung anhalten. (Dies ist ein Grund, warum eine direkte Zustandsänderung in einem Reduzierer schlecht ist.)

Der nächste Schritt besteht darin, die bereitgestellte mapState-Funktion aufzurufen und das aktuelle Statusobjekt zu übergeben. Die Wrapper-Komponente vergleicht dann den Inhalt des Objekts, das von zurückgegeben wurde, mit dem Inhalt des zurückgegebenen Objekts zuletzt. Dabei wird eine oberflächliche Überprüfung des Gleichheitsvergleichs verwendet. Wenn einer der Inhalte basierend auf dieser oberflächlichen Prüfung geändert hat, dann weiß die Komponente, dass sie die "echte" Komponente mit den neuen Daten neu rendern muss. (Auch hier ist der "seichte" Check ein weiterer Grund, warum die Mutation schlecht ist.)

+0

gute Antwort, möchten Sie vielleicht darauf hinweisen, dass "redux" und "react-redux" 2 separate Module sind. :) –

Verwandte Themen