Heim > Web-Frontend > js-Tutorial > Zusammenfassung der Beispiele für Event-Handler von vue.js

Zusammenfassung der Beispiele für Event-Handler von vue.js

零下一度
Freigeben: 2017-06-29 15:47:56
Original
1259 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich die detaillierte Erklärung des Ereignis-Prozessors v-on:click von vue.js vorgestellt. Deshalb werde ich es jetzt für alle und als Referenz für alle teilen. Folgen wir dem Editor und werfen wir einen Blick darauf.

Verwenden Sie den Befehl v-on, um DOM-Ereignisse zu überwachen

Hinweis: v-on kann nicht in HTML5 verwendet werden, ersetzen Sie es mit @

(1) HTML-Code:

<p id="example"> 
 <button v-on:click="greet">Greet</button> 
 // 或者 

<button @click="greet">Greet</button> 
</p>
Nach dem Login kopieren

(2) JS-Code:

var vm = new Vue({ 
 el: &#39;#example&#39;, 
 data: { 
 name: &#39;Vue.js&#39; 
 }, 
 // 在 `methods` 对象中定义方法 
 methods: { 
 greet: function (event) { 
  // 方法内 `this` 指向 vm 
  alert(&#39;Hello &#39; + this.name + &#39;!&#39;) 
  // `event` 是原生 DOM 事件 
  alert(event.target.tagName) 
 } 
 } 
})
Nach dem Login kopieren

(3 ) Effektanzeige:

Das obige ist der detaillierte Inhalt vonZusammenfassung der Beispiele für Event-Handler von vue.js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage