Was ist die Verwendung von $refs und $el in vue

Verwendung: 1. „$refs“ wird verwendet, um Referenzinformationen für Elemente oder Unterkomponenten zu registrieren. Die Syntax lautet „this.$refs.(ref value)“ oder „this.$refs.(ref value).method“. ()“; 2. „$el“ wird verwendet, um das mit der Vue-Instanz verknüpfte DOM-Element abzurufen. Die Syntax lautet „this.$refs.component“.

Die Betriebsumgebung dieses Artikels: Windows 10-System, Vue Version 2.9.6, DELL G3-Computer.

Was sind die Verwendungszwecke von $refs und $el in vue?

ref wird verwendet, um Referenzinformationen für Elemente oder Unterkomponenten zu registrieren:

　1. Um Referenzen zu einem gewöhnlichen Element hinzuzufügen Element, verwenden Sie dieses .$refs. (Ref-Wert) ruft das dom-Element ab 2. Fügen Sie ref zur Unterkomponente hinzu, verwenden Sie this.$refs (Ref-Wert), um die Komponenteninstanz zu erhalten, und Sie können alle Methoden des verwenden Komponente. Wenn Sie die Methode verwenden, können Sie diese direkt verwenden this.$refs.(ref value).method().

　　3. So verwenden Sie v-for und ref, um eine Reihe von Arrays oder Dom-Knoten zu erhalten

　Wenn Sie durch v-for-Traversal verschiedene Refs hinzufügen möchten, denken Sie daran, ein :-Zeichen hinzuzufügen, das heißt: ref = eine Variable ;

　Diese und andere Punkte Die Attribute sind gleich. Wenn es sich um einen festen Wert handelt, muss das :-Zeichen nicht hinzugefügt werden. Wenn es sich um eine Variable handelt, denken Sie daran, das :-Zeichen hinzuzufügen. (Mit einem Doppelpunkt bedeutet dies, dass das, was folgt, eine Variable oder ein Ausdruck ist. Wenn kein Doppelpunkt vorhanden ist, bedeutet dies die entsprechende Zeichenfolgenkonstante (String).

Die Fallstricke, die beachtet werden sollten, sind:

1. ref muss sein Wird nach Abschluss des Dom-Renderings geschrieben. Stellen Sie sicher, dass der Dom gerendert wurde. Rufen Sie ihn beispielsweise im Lebenszyklus-Hook mount(){} auf oder rufen Sie ihn in this.$nextTick(()= auf >{})

2. Wenn ref mehrere doppelte Namen nach der Schleife enthält, ist der Wert von ref ein Array. Um eine einzelne Referenz zu erhalten, führen Sie einfach eine Schleife aus das mit der Vue-Instanz verknüpfte DOM.

Wenn ich beispielsweise die benutzerdefinierte Komponente tabControl und deren OffsetTop abrufen möchte, muss ich zuerst das Attribut ref='a name (tabControl2) festlegen. ' in der Komponente,

Dann erhält dies $refs.tabControl2 die Komponente

Denken Sie daran: ref-Attribut, und wenn Sie die Komponente abrufen, müssen Sie $refs verwenden, um OffsetTop zu erhalten verfügt nicht über OffsetTop und kann daher nicht durch Klicken auf .OffsetTop abgerufen werden. Sie müssen $el verwenden, um die DOM-Elemente in der Komponente abzurufen

Das obige ist der detaillierte Inhalt vonWas ist die Verwendung von $refs und $el in vue. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!