vue事件

1.v-on

监听DOM事件，并在触发时运行一些javascript代码

v-on：简写@

v-on还可以接收一个需要调用的方法名称

所有的方法都需要放到methods对象里面，再进行调用

内联处理器中的方式

除了直接绑定到一个方法，也可以在内联javascript语句中调用方法

<button v-on:click="say('helli xiaobai !')">xiaobai</button>

methods: { say: function(e){ console.log(e) } }

.stop阻止事件冒泡

.prevent阻止默认事件

.capture时间捕获(从上到下)

.self只在元素自身回调

.once只触发一次

按键别名

.enter (“回车”键)
.tab (“TAB”键)
.delete (捕获“删除”和“退格”键)
.esc (“ESC”键)
.space (“空格”键)
.up (向上方向键)
.down (向下方向键)
.left (向左方向键)
.right (向右方向键)

Vue也提供了自定义按键别名的方法

可以使用 `v-on:keyup.f1`

 

Vue.config.keyCodes.f1 = 112

组合按键不能单独触发事件，要与非组合按键一起才能触发事件

.ctrl
.alt
.shift
.meta

<!-- "回车"键 和 "F4"键 触发事件 -->

<input @keyup.enter.f4="confirm">

<!-- "回车"键 和 "CTRL"键 触发事件 -->

<input @keyup.enter.ctrl="confirm">

 

转载于:https://www.cnblogs.com/yangjingyang/p/11388499.html