vue 事件修饰符&按键修饰符

Vue事件修饰符是用来改变事件的行为的特殊标记。它们以点号(".")开头，紧跟着是修饰符的名称。Vue提供了以下事件修饰符：

1. .stop：阻止事件冒泡；
2. .prevent：阻止默认行为；
3. .capture：使用事件捕获模式；
4. .self：只当事件在该元素本身（而不是子元素）触发时触发回调；
5. .once：只触发一次；
6. .passive：告诉浏览器该事件处理程序不会调用preventDefault()。

例如：

<button @click.stop="doSomething"></button>

在这个例子中，当点击按钮时，事件不会冒泡到父元素。

<a href="#" @click.prevent="doSomething"></a>

在这个例子中，当点击链接时，页面不会跳转到指定链接，因为事件被阻止了默认行为。

<div @click.capture="doSomething"></div>

在这个例子中，使用事件捕获模式，事件从最外层元素开始向内传递。

<div @click.self="doSomething"></div>

在这个例子中，只有当点击div元素本身时，事件才会触发回调函数。

<button @click.once="doSomething"></button>

在这个例子中，事件只会触发一次。

<div @touchstart.passive="doSomething"></div>

在这个例子中，告诉浏览器该事件处理程序不会调用preventDefault()，可以提高页面的滚动性能。