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

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

零下一度
零下一度Original
2017-06-29 15:47:561229Durchsuche

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>

(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) 
 } 
 } 
})

(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!

Stellungnahme:
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