Vue中的事件处理

一，基本使用

1.使用v-on:事件名或者@事件名绑定事件

常见的事件有：

onclick, 鼠标单击事件； ondblclick, 鼠标双击事件；onmousedown,鼠标按下去的事件；onmouseup,鼠标弹起事件；

onmouseover,onmouseenter,onmouseout,onmouseleave, onmousemove 监控鼠标的移入移出，以及移动事件

onkeydown, onkeyup, onkeypress 监控键盘的按下和弹起。

这里把on改为@即可

2.eg:@click="show"这样的写法默认会传一个事件的参数，如果写成@click="show(a)",这样就会把默认的事件参数取消掉，如果还想再把event参数传过去，就必须使用@click="show(a,$event)"才可以

二，常用的事件修饰符

.stop 阻止事件继续传播。

#阻止事件冒泡
前往下一页

.stop 相当于在 toNext 方法上执行了 e.stopPropagation && e.cancelBubble = true;

.prevent 阻止标签的默认事件。

#阻止默认事件行为。


.prevent 相当于在 toNext 方法上执行了 e.preventDefault()，IE： e.returnValue = false;

.capture 添加事件监听器使用事件捕获模式，即处理顺序从body->目标元素。

...

.self 判断event.target是自己触发的，还是子元素冒泡过来的。.self就只接受自己触发的事件。

...

.once 表示点击事件只触发一次。

#vue版本2.1.0 点击事件将只会触发一次. 

三，按键事件的常用键