Ist es in Ordnung, einen Container in eine Komponente in Redux zu legen?

Question

Ich hacke mit React/Redux und habe viele Container und Komponenten gebaut.

Allerdings stieß ich vor kurzem eine Design-Wahl mir, dass so aussehen auf meinem Element gemacht:

Meine Frage ist, ist dieser Entwurf OK? Grundsätzlich habe ich Probleme damit, die Redux Actions an den Button zu übergeben, da der Button ein paar Ebenen tief ist. Ich könnte die Aktionen von Komponente 0 auf Komponente von HeaderContainer weiterleiten, aber wenn das DOM tiefer wird, würde es immer schlimmer werden.

Ich habe das Gefühl, dass dieses Design FALSCH ist, da eine Präsentationskomponente eine Containerkomponente aufruft.

Irgendwelche Gedanken?

Answer 1

Sie haben drei Möglichkeiten:

• Zunächst ist direkt auf die Schaltfläche Komponente in den Laden zu verbinden und lassen Sie es beide Behälter & Präsentations-Komponente sein. Einfach und effektiv.

  export default connect(mapStateToProps, mapDispatchToProps)(ButtonComponent)

  ein Beispiel aus dem Schöpfer von Redux here (die 4. post)

• Zweite einen Behälter Siehe zu erstellen, ist die Taste wickeln und die Taste Präsentations nur sein lassen - Ihre aktuelle Implementierung. Sehr gute geschichtete Architektur, aber an dieser Stelle für mich überentwickelt.

• Drittens ist die Aktion von der HeaderComponentContainer auf die ButtonComponent zu übergeben.

---

ich für die dritte gehen würde, wenn die Taste nicht mehr als 2 Ebenen tief ist, da Sie bereits Ihre HeaderComponentContainer und als Eltern verbunden ist es ihre Verantwortung, um zu bestimmen, welche Funktionen ihre Kinder zur Verfügung stellen sollten (Sie sind nur anwesend, oder?).

PS. Sie können React's context verwenden, um Aktionen/Eigenschaften beliebig tief in der Hierarchie zu übergeben, ohne dies explizit für jede Komponente zu tun.