vue -- 按键修饰符

在监听键盘事件时，我们经常需要查找常用按键对应的 code 值。Vue 可以在 v-on 上添加按键修饰符，用于监听按键事件 这里列出所有的按键修饰符别名：

.enter => // enter键 .tab => // tab键 .delete (捕获“删除”和“退格”按键) => // 删除键 .esc => // 取消键 .space => // 空格键 .up => // 上 .down => // 下 .left => // 左 .right => // 右

记住所有 keyCode 是非常麻烦的事，所以 Vue 提供一些最常用按键的别名

<!-- 也可用于简写语法 --> <input @keyup.enter="submit">

自定义按键修饰符别名

// 可以使用 `v-on:keyup.f1` Vue.config.keyCodes.f1 = 112

自动对应按键修饰符 也可以直接使用 KeyboardEvent.key 暴露出来的所有合法按键名作为修饰符，但是要将它们转换为串联式命名(kebab-case)

<input @keyup.page-down="onPageDown">

系统辅助按键 仅在以下修饰符对应的按键被按下时，才会触发鼠标或键盘事件监听器

.ctrl .alt .shift .meta

例如：

<!-- Alt + C --> <input @keyup.alt.67="clear"> <!-- Ctrl + Click --> <div @click.ctrl="doSomething">做一些操作</div>

转载于:https://www.cnblogs.com/zjh-study/p/10656389.html

相关资源：JAVA上百实例源码以及开源项目