Vue中有好多修饰符，可以用来修饰功能。
一、表单修饰符
1、.lazy
在默认情况下，v-model 在每次 input 事件触发后将输入框的值与数据进行同步 ，可以添加 lazy 修饰符，从而转为在 change 事件之后进行同步:
<input v-model.lazy="msg">
2、.number
如果想自动将用户的输入值转为数值类型，可以给 v-model 添加 number 修饰符：
<input v-model.number="age" type="number">
3、.trim
如果要自动过滤用户输入的首尾空白字符，可以给 v-model 添加 trim 修饰符：
<input v-model.trim="msg">
二、事件修饰符
1、.stop
阻止单击事件继续传播。
<!--这里只会触发a-->
<div @click="divClick"><a v-on:click="aClick">点击</a></div>
2、.prevent
阻止标签的默认行为。
<a href="http://www.baidu.com" v-on:click.prevent="aClick">点击</a>
3、.capture
事件先在有.capture修饰符的节点上触发，然后在其包裹的内部节点中触发。
<!--这里先执行divClick事件，然后再执行aClick事件-->
<div @click="divClick"><a v-on:click="aClick">点击</a></div>
4、.self
只当在 event.target 是当前元素自身时触发处理函数，即事件不是从内部元素触发的。
<!--在a标签上点击时只会触发aClick事件，只有点击phrase的时候才会触发divClick事件-->
<div @click.self="divClick">phrase<a v-on:click="aClick">点击</a></div>
5、.once
不像其它只能对原生的 DOM 事件起作用的修饰符，.once 修饰符还能被用到自定义的组件事件上，表示当前事件只触发一次。
<a v-on:click.once="aClick">点击</a>
6、.passive
.passive 修饰符尤其能够提升移动端的性能
<!-- 滚动事件的默认行为 (即滚动行为) 将会立即触发 -->
<!-- 而不会等待 `onScroll` 完成 -->
<!-- 这其中包含 `event.preventDefault()` 的情况 -->
<div v-on:scroll.passive="onScroll">...</div>
三、其他修饰符
除了表单和事件的修饰符，Vue还提供了很多其他修饰符，在使用的时候可以查阅文档。
小结
Vue中提供了很多好用的功能和api，那么修饰符的出现就为功能和api提供了更为丰富的扩展属性和更大的灵活度。
