Vermeiden von tief verschachtelten Komponentenbäumen

Indem Sie untergeordnete Komponenten anstelle von Daten weitergeben, können Sie vermeiden, dass Daten über viele Ebenen von Komponenten weitergegeben werden. Außerdem werden Ihre Komponenten dadurch leichter wiederverwendbar. Selbst Komponenten für mehrere Marken lassen sich viel einfacher erstellen. Insgesamt handelt es sich um ein Muster, das Ihren Frontend-Code erheblich verbessert!

Das Problem

Bei der Erstellung von Frontends werden Sie Daten von einer übergeordneten Komponente an eine untergeordnete Komponente weitergeben. Oftmals rendert die untergeordnete Komponente diese Daten, aber nicht die Komponente, die sie weitergibt. Die untergeordneten Komponenten haben andere Datenanforderungen als Ihre aktuelle Komponente. Dann fügen Sie eine neue Komponente hinzu, irgendwo in Ihrem Komponentenbaum. Sie hat neue Datenanforderungen, so dass Sie ihre Daten über alle übergeordneten Komponenten weitergeben müssen. Zusätzlich zu den Daten benötigt sie möglicherweise auch Rückrufe, um Interaktivität zu bieten. Auch diese müssen Sie durch alle übergeordneten Komponenten leiten. Sie ändern eine Menge Dateien, um neue Funktionen hinzuzufügen. Durch die vielen Datenübertragungen verringert sich auch die Lesbarkeit Ihres Codes. Insgesamt nimmt die Wartbarkeit der Codebasis ab. Codebeispiele und mehr auf Medium.com