„Wenn ein Arbeiter seine Arbeit gut machen will, muss er zuerst seine Werkzeuge schärfen.“ – Konfuzius, „Die Gespräche des Konfuzius. Lu Linggong“
Titelseite > Programmierung > Requisiten-Grundlagen: Teil 1

Requisiten-Grundlagen: Teil 1

Veröffentlicht am 08.11.2024
Durchsuche:352

Dies ist ein anfängerfreundliches Tutorial zum Umgang mit Requisiten. Es ist wichtig, dass Sie verstehen, was Destrukturierung ist und wie Sie Komponenten verwenden/erstellen, bevor Sie lesen.

Props, kurz für Eigenschaften, Props ermöglichen es uns, Informationen von übergeordneten Komponenten an untergeordnete Komponenten zu senden. Es ist auch wichtig zu beachten, dass es sich dabei um beliebige Datentypen handeln kann.

Es ist unbedingt erforderlich, die Syntax zum Erstellen einer Requisite für eine Ihrer Komponenten zu verstehen. In React müssen Sie dieselbe Syntax zum Schreiben eines Attributs für ein HTML-Tag verwenden. Wir geben eine Requisite an, indem wir sie wie folgt in unser Element einfügen:


ParentPlant() {
  return  
}


Eine gute Regel, die Sie beim Erstellen von Requisiten beachten sollten, ist: Strings müssen keine geschweiften Klammern um ihren Wert haben, wir tun dies nur für andere Datentypen. Wie Sie oben sehen können, können wir eine Vielzahl von Requisiten haben, indem wir sie der übergeordneten Komponente zuweisen. Wenn wir unsere Requisiten in unserer Komponente haben, ist es wichtig zu wissen, dass wir sie technisch gesehen weitergeben. Sobald wir unsere Requisiten weitergeben, müssen wir in der Lage sein, sie innerhalb unserer gewünschten Komponente zu empfangen. In diesem Fall unsere ChildPlant-Komponente.

Requisiten erhalten:


function ChildPlant(props) {
  return (
    
      {props.text} {props.number}
    >
  )
}


Wir machen hier folgende Dinge: 1. Wir empfangen unsere Requisite innerhalb des Parameters unserer ChildPlant-Komponente, 2. Wir zerstören die Werte unserer Requisite über den Namen unserer Requisite. Es ist wichtig zu wissen, dass unsere Requisiten keine Parameter sind, sondern eher ähnliche Funktionen haben.

Die einzige Möglichkeit, Daten der übergeordneten Komponente an die untergeordnete Komponente weiterzugeben, sind Requisiten. Ich stelle es mir gerne wie DNA vor, eine übergeordnete Komponente enthält Aspekte von sich selbst, die bereits in ihr vorhanden sind. Da dieses Kind auch Aspekte der DNA seiner Eltern haben kann, wirken Requisiten wie der Aktivator, der die Haare dieses Kindes rot, schwarz oder blond macht.

Requisiten werden in der untergeordneten Funktion empfangen und über die übergeordnete Funktion gesendet, Requisiten können jedoch nur nach unten und niemals wieder nach oben gesendet werden. Wir können uns Requisiten auch als Objekte vorstellen. Dies liegt daran, dass sie im Wesentlichen Daten enthalten, die Schlüssel-Wert-Paaren ähneln. Um noch einmal darauf zurückzukommen, warum sie Parametern ähnlich sind: Sie speichern mehrere Objekte in sich. Ich stelle mir den Bereich, in dem Requisiten aufgenommen werden, gerne als Platzhalter vor. Sie nehmen Platz für ein Objekt ein, das wir mit unserer Komponente teilen möchten, und tauschen es bei Bedarf durch Destrukturierung und Punktnotation aus.

Hier ist eine gute Möglichkeit, es zu visualisieren:

Props Basics: Part 1

Hier können wir uns Requisiten vorstellen, die alles in unseren quadratischen Kästchen enthalten, wobei jedes seinen jeweiligen Datenwert aus unserem ersten Beispiel enthält. Jetzt verwenden wir einfach unsere Destrukturierungsmethode, um den Wert unserer Requisite zu ermitteln. Und so nutzen Sie Requisiten auf den Punkt gebracht!

Freigabeerklärung Dieser Artikel ist abgedruckt unter: https://dev.to/alegendcodes/props-basics-part-1-1mmk?1 Bei Verstößen wenden Sie sich bitte an [email protected], um ihn zu löschen
Neuestes Tutorial Mehr>

Haftungsausschluss: Alle bereitgestellten Ressourcen stammen teilweise aus dem Internet. Wenn eine Verletzung Ihres Urheberrechts oder anderer Rechte und Interessen vorliegt, erläutern Sie bitte die detaillierten Gründe und legen Sie einen Nachweis des Urheberrechts oder Ihrer Rechte und Interessen vor und senden Sie ihn dann an die E-Mail-Adresse: [email protected] Wir werden die Angelegenheit so schnell wie möglich für Sie erledigen.

Copyright© 2022 湘ICP备2022001581号-3