Vue修饰符

1.表单修饰符

.lazy - 我们输入完所有东西，光标离开才更新视图

.trim - 过滤首尾空格

.number - 自动将用户的输入值转为数值类型，如果你先输入数字，那它就会限制你输入的只能是数字。如果你先输入字符串，那它就相当于没有加.number

2.事件修饰符

.stop - 调用 event.stopPropagation(), 阻止事件冒泡(不触发父级事件)。

.prevent - 调用 event.preventDefault(), 阻止默认行为，比如点击链接会进行跳转；填写表单时按回车会自动提交到服务器；点击鼠标右键会呼出浏览器右键菜单。 

.capture - 添加事件侦听器时使用 capture 模式。事件触发从包含这个元素的顶层开始往下触发，即内部元素触发的事件先在此处理，然后才交由内部元素进行处理。完整的事件机制是：捕获阶段--目标阶段--冒泡阶段  

.self - 只当事件是从侦听器绑定的元素本身触发时才触发回调。 

.native - 在父组件中给子组件绑定一个原生的事件，就将子组件变成了普通的HTML标签看待。 

.once - 只触发一次回调。 

.passive - { passive: true } 模式添加侦听器。当我们在监听元素滚动事件的时候，会一直触发onscroll事件，在pc端是没啥问题的，但是在移动端，会让我们的网页变卡，因此我们使用这个修饰符的时候，相当于给onscroll事件整了一个.lazy修饰符。 

3.鼠标按键修饰符 

.left - (2.2.0) 只当点击鼠标左键时触发。

.right - (2.2.0) 只当点击鼠标右键时触发。 

.middle - (2.2.0) 只当点击鼠标中键时触发。 

.enter .tab  .esc .space .up .down
.delete ==> 删除和退格 

4.键值修饰符 

.keyCode - 只当事件是从特定键触发时才触发回调。

.exact - 只需要或者只能按一个系统修饰键来触发。 

5.其他修饰符 

.sync - 父子组件进行双向数据绑定，与v-model相似。

.camel - HTML 特性是不区分大小写的，该修饰符使属性被渲染为驼峰名

.prop - 作为一个 DOM property 绑定而不是作为 attribute 绑定。(差别在哪里？)

• property 和 attribute 🔗
  attribute（特性），是我们赋予某个事物的特质或对象。
  property（属性），是早已存在的不需要外界赋予的特质。