Welchen Effekt haben mehrere Statuskomponenten auf die react App?

Question

Gemäß den Dokumenten sollte man vermeiden, mehrere Komponenten mit Zustand zu haben. Ich bin in der Situation, in der ich ein Textfeld machen möchte, das automatisch vertikal erweitert, während der Benutzer schreibt, und dafür verwende ich diesen Trick http://www.impressivewebs.com/textarea-auto-resize/, was bedeutet, dass ich die Höhe einer Komponente erhalten muss. Jetzt habe ich ein bisschen herumgespielt, und es scheint nicht machbar, eine Referenz an meine Elternkomponente zu übergeben, die den Status enthält, also wäre der einfache Ausweg, ein Stück des Zustands in der Komponente mit dem zu behalten Textfeld, und verwenden Sie dann die Ref von dort.

Das hat mich zum Nachdenken gebracht, wie genau beeinflussen mehrere staatliche Komponenten meine App? Ist es nur Wartbarkeit/Verständlichkeit? Oder gibt es tatsächliche Leistungsprobleme damit? Ich habe eine Menge Open-Source-Reaktionskomponenten bemerkt, die Sie einfach in Ihren App-Keep-Status einklinken würden. Das heißt, wenn Sie Open-Source-Komponenten verwenden, haben Sie wahrscheinlich mehrere Statuskomponenten in Ihrer App.

Answer 1

Es ist völlig ok, den lokalen Status für diese Art von Tricks auf DOM zu verwenden. Es ist sogar besser Ansatz, als diese Implementierungsdetails zu übergeordneten Komponenten zu teilen.

Im Allgemeinen verwenden diese Orte für Zustand:

1. Anwendungsweiten Daten in den Speichern außerhalb reagieren (redux, flux-store, Observablen)
2. Formular temporäre Daten können auch im Speicher platziert werden. Aber wenn Sie es nicht anderswo als form benötigen, ist es besser, diese Daten in Form-Komponente zu platzieren.
3. Tricks auf DOM, kurzlebig und sehr lokalen Zustand kann in der Komponente platziert werden, dass sie gerade brauchen

---

gibt es tatsächliche Performance-Probleme mit ihm?

Nein. Wenn Sie alle Ihre Status in Komponenten platzieren, wird Ihre Anwendung noch schneller. Wenn Sie den lokalen Status aktualisieren, werden nur diese Komponente und ihre Childs aktualisiert.

Aber Sie sollten das nicht tun, weil es Wartbarkeit tötet.

viele Open-Source-Komponenten, die reagieren Sie würden nur Zustand halten, um Ihre Anwendung stecken in

Wenn die Komponente nicht zulässt Sie es durch die Requisiten steuern - es schlechte Komponente ist. In der Regel Open-Source-Komponenten geschrieben, um einfacher zu bedienen, so bieten sie schöne Standardeinstellungen, mit denen Sie einfach Komponente in Ihre Anwendung platzieren, und damit glücklich sein.

Zum Beispiel Tabs Komponente steuert in der Regel ausgewählten Registerkarte mit lokalen Status. Aber es dauert auch selectedTab und Rückruf onSelect, so können Sie es selbst steuern.

Answer 2

Dumme Komponenten (wie Ihre Textbereichskomponente) sollten keinen Zustand mit Daten haben. Sie können jedoch ihren eigenen UI-Status haben.
In diesem Fall können Sie leicht Textarea Höhe im Zustand der dummen Komponente halten.