持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第24天，点击查看活动详情
修饰符是由
.开头的指令后缀来表示的,可以理解成一种封装好的限定，不需要我们再去处理 DOM 事件的细节。
写vue页面的时候，在事件和表单上经常使用到修饰符，当然它还有其他更多的使用场景：
- 表单修饰符
v-model - 事件修饰符
v-on，如@click @... - 鼠标按键修饰符
- 键值修饰符
- v-bind修饰符
1. 表单修饰符
- lazy
当光标离开当前标签时，才会将值赋予给
value（在change时更新而非input时）
v-model.lazy="value"
- number
自动将入值转为数值类型
v-model.number="value"
- trim 自动过滤掉用户输入的首尾空白字符
2. 事件修饰符
js中有关于处理冒泡以及阻止捕获等操作的指令
- stop
阻止事件冒泡,效果同event.stopPropagation
<button @click.stop="doSomething">点我</button>
- prevent
阻止事件的默认行为，效果同event.preventDefault
- native
让组件像html内置标签那样监听根元素的原生事件.（注：使用.native修饰普通HTML标签会令事件失效）
<my-component @click.native="doSomething" />
-
once 事件只触发一次
-
self 操作的是是当前元素自身时触发
同时修饰符还支持连续多个的写法，不同的顺序结果也会有差异：
@click.prevent.self：阻止所有的点击（prevent阻止在前）
@click.self.prevent：只阻止元素自身的点击（self在前）
- capture 当元素是父子级的结构，并且绑定了同样的方法，事件从包含这个元素的顶层开始往下触发
3. 鼠标 & 键盘
鼠标：
- left 为左键点击设定事件
@click.left="doSomething" - middle 滚轮
- right 右键
键盘：
键盘事件分为@onkeyup，@onkeydown，可以为其绑定keyCode，如：keyup.13="doSomething"，或者使用别名：keyup.enter="doSomething"
多个修饰符可以表示按键的组合：@keyup.ctrl.67="doSomething"
4. v-bind（属性）
- async
对
props进行双向绑定 - prop 设置自定义标签属性
- camel
将命名变为驼峰命名法
