vue修饰符

修饰符（Modifiers）是以半角句号.指明的特殊后缀，用于指出一个指令应该以特殊方式绑定。

.prevent: 提交事件不再重载页面

.stop: 阻止单击事件冒泡

.self: 当事件发生在该元素本身而不是子元素的时候会触发

.capture: 事件侦听，事件发生的时候会调用

.once: 跟v-once作用类似，只渲染一次，第二次不会执行

例如： 在事件处理器中经常会需要调用event.preventDefault()或event.stopPropagation()。

Vue.js为v-on提供两个事件修饰符：.prevent与.stop。

当然在 methods 中也可以轻松实现事件的处理，但是methods 出现的初衷是数据逻辑，而不是去处理 DOM 事件。

为了简单明了，直接上代码

<button  v-on:click.stop="doThis">单击按钮阻止事件冒泡</button>

<form v-on:submit.prevent="onSumbit">提交事件不再重新加载页面</form>

<a v-on:click.stop.prevent="doThis">修饰符可以连着打点调用</a>

<div v-on:click.capture="doThat">添加事件监听器</div>

<div v-on:click.self="doThis">只当事件在该元素本身</div>

另外，.ctrl.alt.shift.meta  这四个是新增的修饰符开启鼠标或键盘事件监听，使在按键按下时发生响应。