Reagieren Sie: Zustand gegen Requisiten

Das heutige Datum ist der 4. April 2019. Ich habe keine Ahnung, wo die letzten drei Monate vergangen sind, und ich kann nicht glauben, dass ich bereits die Hälfte der ersten Woche von Mod 4 bei Flatiron hinter mir habe. Jeden Tag lerne und realisiere ich so viele neue Dinge. Manchmal fühle ich mich wie Scarlett Johansson in Lucy, manchmal bin ich mir ziemlich sicher, dass alle Aktivitäten in meinem Gehirn aufgehört haben.

Nach drei Wochen JavaScript dreht sich in Mod 4 alles um React. Zuerst muss ich sagen, dass ich JavaScript liebe und ich plane, daran zu arbeiten, die Sprache zu beherrschen, wenn ich ein bisschen mehr Freizeit habe. Abgesehen davon gefällt mir auch die React.JS-Bibliothek sehr gut. Es fühlt sich so an, als könnte ich während unserer Vanille-JavaScript-Tage darüber nachdenken, das DOM organisieren und manipulieren.

Zwei der wichtigsten Datenstrukturen in React sind state und requisiten. Da es bei React ausschließlich um die Komponenten und deren Daten geht, haben wir viel mit Status und Requisiten zu tun, und ich wollte sie ein wenig genauer untersuchen. Sowohl Status als auch Requisiten sind einfache JS-Objekte, die Daten enthalten, Renderupdates auslösen und deterministisch sind. Aber was sind ihre Unterschiede? Was macht jeder und wann soll ich ihn benutzen?

Zustand

Im Status einer Komponente werden die Daten gespeichert, die bestimmen, wie sich diese Komponente verhält und gerendert wird. Staat ist veränderlich, aber eine Komponente ist hauptsächlich für die Änderung ihres Zustands verantwortlich. Statuswerte können von übergeordneten Komponenten geerbt werden, eine Änderung des Status einer untergeordneten Komponente würde sich jedoch nicht auf die übergeordneten Komponenten auswirken. Wann verwenden wir also state? Da der Status „die Komplexität erhöht und die Vorhersagbarkeit verringert“, ist es vorzuziehen, die Verwendung des Status für Komponenten einzuschränken, und wir sollten ihn nur verwenden, wenn eine Komponente eines ihrer Attribute ändern muss.

Requisiten

Der Datenfluss in React ist vergleichbar mit einem stromabwärts fließenden Fluss oder der Genealogie innerhalb eines Stammbaums. Die Daten werden von den obersten Komponenten nach unten in die von ihnen abhängigen Komponenten übertragen, oder untergeordnete Komponenten erben Daten von ihren übergeordneten Komponenten. Requisiten sind die Gefäße, mit denen wir diese Daten übermitteln, sie sind die DNA. Requisiten werden sowohl von den übergeordneten Komponenten an das untergeordnete Element vererbt als auch zum Übergeben von Daten von diesem untergeordneten Element an ein nachfolgendes untergeordnetes Element verwendet. Requisiten sind unveränderliche „Nur-Lese“ -Daten. Sobald dieses Objekt instanziiert ist, können seine Eigenschaften nicht mehr geändert werden.

Warten Sie, damit der Status innerhalb einer Komponente verwaltet wird und Requisiten nur nach unten an eine untergeordnete Komponente übergeben werden können. Gibt es keine Möglichkeit, Änderungen an einer untergeordneten Komponente in einem ihrer Vorfahren widerzuspiegeln? Möchten wir nicht Änderungen an anderen verwandten Elementen mitteilen, um diese synchron zu halten? Nun, das gibt es! Wir können ~ Rückruffunktionen ~ verwenden!

Leider habe ich für heute keine Zeit mehr. Schauen Sie sich also meinen bald erscheinenden Follow-up-Blog zu Rückruffunktionen und Hebezustand an!

Quellen: