2016-12-07 6 views
1

Ich habe eine Menge von Zeiten gehört, dass es eine gute Übung ist, nur die oberste Ebene (intelligente Komponenten) zu verbinden und dann können sie die Stützen auf ihre niedrigere Ebene propagieren (dumme Komponenten).React + Redux - Warum nicht alle Komponenten verbinden?

Es scheint mir nur, dass das Erstellen einer dummen Komponente immer noch möglich ist, wenn Sie sie verbinden - einfach Sie übergeben sie nur primitive Objekte \ Argumente, die angezeigt werden sollen.

Ist es eine gute Praxis, alle Komponenten über @connect mit dem Geschäft zu verbinden? Gibt es Auswirkungen auf die Leistung?

Irgendwelche Gedanken?

Antwort

4

Ein Tweet von Dan Abramov, Autor von Redux:

„eine Container-Komponente an der Spitze“ in Redux Beispielen war ein Fehler hervorhebend. Nimm das nicht als Maxime.

Lesen Sie auch seine Antworten auf https://twitter.com/dan_abramov/status/668585589609005056

+1

Ja. Weitere Informationen finden Sie in der Redux-FAQ unter http://redux.js.org/docs/faq/ReactRedux.html#react-multiple-components. – markerikson

1

sollten Sie nicht unbedingt nur Top-Level-Komponenten verbinden. Sobald Sie damit beginnen, werden Sie feststellen, dass einige von ihnen wachsen und Daten weitergeben, die sie nicht tatsächlich rendern oder verwenden.

Die Lösung für dieses Problem besteht darin, untergeordnete Komponenten zu verbinden, die auf diesen nicht verwendeten Daten beruhen. Je niedriger Sie sich im Komponentenbaum bewegen, desto generischer (dumm) und wiederverwendbar werden die Komponenten.

2

Dan Abramov gangen, dass in einem Beitrag auf Medium ein paar Jahren: https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0#.vtq34z4ir

Er nennt sie "Präsentations" versus "Container" Komponenten. Ich finde die Namen komisch und verwirrend, was es (sogar) schwerer zu verstehen macht. Aber das Ziel ist, dass ich die anwendungsspezifischen Dinge (die die Verbindung zu den Besonderheiten des Redux-Stores beinhalten) auf Ihre Container-Komponenten konzentrieren kann.

Präsentationskomponenten sind stärker isoliert von Ihrer spezifischen Anwendung. Sie sind leichter unabhängig voneinander zu testen, weil sie leicht sind und ohne Redux aufgerufen werden können. Sie haben eine bessere Chance, wiederverwendet zu werden, da sie nicht mit dem spezifischen Datenformat Ihrer App (oder überhaupt Redux) verbunden sind.

Persönlich bin ich nicht davon überzeugt, dass die Unterscheidung zu erhalten lohnt. Wirklich leichte, wiederverwendbare Komponenten werden normalerweise von jemand anderem importiert. Praktisch alles, was Sie schreiben, wird am Ende mit den Besonderheiten Ihres Datenspeichers verbunden sein ... denn das ist der Punkt, an dem Sie es schreiben. Das Schreiben wirklich wiederverwendbarer Komponenten, die vorher nicht geschrieben wurden, ist relativ selten. Wenn Sie einen machen, wird es relativ einfach sein, es nach der Tat zu befreien. (Ich bin sehr darauf bedacht, Ihre Frameworks nicht zu überdenken, da Sie dazu neigen, sie falsch zu verstehen und sowieso umzuformen.)

Noch ist es ein Paradigma direkt von dem Typ, der React erfunden hat, und es gibt einen riesigen Benutzer Basis dort erfolgreich Code mit ihm zu schreiben. Also würde ich mit seiner Meinung über meine gehen, wenn ich du wäre.

Verwandte Themen