Vue核心 事件处理

事件处理

绑定监听

• v-on:xxx=“fun”
• @xxx=“fun”
• @xxx=“fun(参数)”
• 默认事件形参: event
• 隐含属性对象: $even

事件修饰符

• prevent：阻止默认事件（常用)
• stop：阻止事件冒泡（常用)
• once：事件只触发一次（常用)
• capture：使用事件的捕获模式
• self：只有event.target是当前操作的元素时才触发事件
• passive：事件的默认行为立即执行，无需等待事件回调执行完毕修饰符
• 说明：修饰符可以连续写，比如可以这么用:@click.prevent.stop=“XXX”

键盘事件

键盘上的每个按键都有自己的名称和编码，例如: Enter (13)。而(vue还对一些常用按键起了别名方便使用

1、Vue中常用的按键别名

• 回车enter
• 删除delete捕获“删除”和“退格”键退出esc
• 空格space
• 换行tab 特殊，必须配合keydown去使用
• 上up
• 下down
• 左left
• 右right

2、Vue未提供别名的按键，可以使用按键原始的key值去绑定，但注意要转为kebab-case(多单词小写短横线写法)
3、系统修饰键（用法特殊)ctrl altshiftmeta( meta 就是win键)

• 配合keyup 使用:按下修饰键的同时，再按下其他键，随后释放其他键，事件才被触发 指定ctr+y 使用@keyup.ctr.y
• 配合keydown使用:正常触发事件

4、也可以使用keyCode去指定具体的按键（不推荐)
5.、Vue.config.keyCodes.自定义键名=键码，可以去定制按键别名

闲鱼礼物