事件处理
绑定监听
- 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.自定义键名=键码,可以去定制按键别名