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(属性),是早已存在的不需要外界赋予的特质。
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐