vue修饰符

修饰符是以点开头的指令后缀，用于给当前

指令设置特殊操作。

修饰符

• 事件修饰符

• 按键修饰符

• 系统修饰符

• 鼠标修饰符

• v-model 修饰符

事件修饰符

.prevent 修饰符

• .stop 修饰符

• .once 修饰符

.prevent 修饰符

• 用于阻止默认事件行为，相当于 event.preventDefault()。

.stop 修饰符.

• 用于阻止事件传播，相当于 event.stopPropagation()。

• Vue.js 中允许修饰符进行连写，例如：@click.prevent.stop

.once 修饰符

• 用于设置事件只会触发一次。按键修饰符按键修饰符

• 按键码

• 按键码指的是将按键的按键码作为修饰符使用以标识按键的操作

方式。

特殊按键

• 特殊按键指的是键盘中类似 esc、enter、delete 等功能按键，

为了更好的兼容性，应首选内置别名

系统修饰符

系统按键指的是 ctrl 、alt 、shift 等按

键。单独点击系统操作符无效。系统按键通常与其他按键组合使用。

• .ctrl 修饰符

系统修饰符

• .alt 修饰符

• .shift 修饰符

鼠标按键修饰符

用于设置点击事件由鼠标哪个按键来完成。

鼠标按键修饰符

• .left 修饰符

• .right 修饰符

• .middle 修饰符

v-model 修饰符•

.trim 修饰符

• .lazy 修饰符

• .number 修饰符

.trim 修饰符

• 用于自动过滤用户输入内容首尾两端的空格。.

lazy 修饰符

• 用于将 v-model 的触发方式由 input 事件触发更改为 change

事件触发。

.number 修饰符

• 用于自动将用户输入的值转换为数值类型，如无法被parseFloat() 转换，则返回原始内容。自定义指令指令用于简化 DOM 操作，相当于对基础 DOM 操作的一种封装。当我们希望使用一些内置指令不具备的 DOM 功能时，可以进行自定义指令设置。自定义指令

• 自定义全局指令

• 自定义局部指令自定义全局指令自定义全局指令

• 指的是可以被任意 Vue 实例或组件使用的指令。

 

自定义局部指令

• 指的是可以在当前 Vue 实例或组件内使用的指令。