Heim >Web-Frontend >js-Tutorial >Vue JS Emit-Funktion
Wir verwenden die Emit-Funktion zum Übergeben von Daten von der untergeordneten Komponente an die übergeordnete Komponente und zeigen Ihnen, wie es in Codes funktioniert
Wir starten die Emit-Funktion von der untergeordneten Komponente
<template> <div> <div> <p>Jetzt können wir sie an die übergeordnete Komponente übergeben<br> </p> <pre class="brush:php;toolbar:false"><template> <div> <div> <p>Das Ergebnis ist</p> <p><img src="https://img.php.cn/upload/article/000/000/000/173201082567193.jpg" alt="Vue JS Emit function" /></p> <p>Lassen Sie uns lernen, wie es funktioniert</p> <p>- {defineEmits, ref} aus „vue“ importieren; Notwendige Dinge aus Vue importieren<br> - const count=ref(0); Erstellen Sie eine verifizierbare Variable und geben Sie ihr mit ref <br> einen Standardwert <br> - const emit=defineEmits(); Es muss defineEmits in einer beliebigen verifiablen Form deklariert werden<br> - const user=[<br> {id:1, Name:"khusi", Alter:20, Beruf:"IT"},<br> {id:1, Name:"khusi", Alter:20, Beruf:"IT"},<br> {id:1, Name:"khusi", Alter:20, Beruf:"IT"},<br> {id:1, Name:"khusi", Alter:20, Beruf:"IT"},<br> ] Verwendung aus beliebigen Daten<br> - const sendDate=()=>{<br> emit("counter", 11);<br> emit("Benutzer", Benutzer);<br> } Wir erstellen eine Funktion und geben ihr als erste optionale Nummer und als zweite unsere Daten innerhalb von defineEmits und in die Zeichenfolge schreiben wir einen optionalen Namen für die Verwendung in der übergeordneten Komponente<br> Und wir lernen, wie man sie in der übergeordneten Komponente aufruft <p>-const subscribeEmit=(e)=>{<br> console.log(e);<br> emit("counter", e) <br> }<br> -const subscribeUser=(e)=>{<br> console.log(e);<br> emit("users", e);<br> } Zwei Funktionen erstellt und darin rufen wir unsere Emit-Variable aus der untergeordneten Komponente auf und geben ihr ihren Namen und e. In diesem Fall ist e=Unsere optionale Zahl 11 und unsere Daten<br> - <ComponentD @counter="submitEmit" @users="submitUser"/> Schließlich rufen wir zwei Funktionen unter „emit optionalen Namen“ auf und können die Ergebnisse auf der Konsole sehen</p> <p>Vielen Dank an alle für die Aufmerksamkeit</p>
Das obige ist der detaillierte Inhalt vonVue JS Emit-Funktion. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!