SOURCE

var app = new Vue({
  el: '#app',
  data() {
    return {

    }
    
  }, 
  methods: {
     on(){
         alert('vue点击事件')
     },
     onblur(){
         console.log('失去焦点')
     },
     onfocus(){
         console.log('获取焦点')
     },
     method(message,e){
         console.log(message)
         console.log(e)
     }
  }
  
});

<div id="app">
    <div @click="on">点击事件</div>
    <input type="text" @blur="onblur" @focus="onfocus" value="获取焦点 失去焦点事件">
    <br>
    <br>
    <button @click="method('访问',$event)">访问原始的 DOM 事件</button>
    <hr>
    <h4>事件修饰符</h4>
    <!-- 点击事件将只会触发一次 -->
<a @click.once="on"><h5>①防止多点:</h5>.once  :点击事件将只会触发一次</a>

<hr>
<h4>按键修饰符</h4>
例如:搜索框输入完成按回车键执行<br>
<input type="text" @keyup.enter="on">

</div>

img{
    width: 20%;
}