vue.js 이벤트 핸들러 예제 요약

이 글은 주로 vue.js의 eventprocessor v-on:click을 자세하게 소개하고 있습니다. 편집자께서 꽤 괜찮다고 하셔서 지금 공유하고 참고용으로 올려드리겠습니다. 편집기를 따라 살펴보겠습니다

v-on 명령을 사용하여 DOM 이벤트 모니터링

참고: v-on은 HTML5에서 사용할 수 없습니다. @

로 바꾸세요. (1) html 코드:

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

<button @click="greet">Greet</button> 
</p>

( 2) js 코드:

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

(3) 효과 표시:

위 내용은 vue.js 이벤트 핸들러 예제 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!