Vue中键盘事件
键盘事件:
keyCode 实际值
- 48到57 0 - 9
- 65到90 a - z ( A-Z )
- 112到135 F1 - F24
- 8 BackSpace ( 退格 )
- 9 Tab
- 13 Enter ( 回车 )
- 20 Caps Lock ( 大写)
- 32 Space ( 空格键 )
- 37 Left ( 左箭头 )
- 38 Up ( 上箭头 )
- 39 Right ( 右箭头)
- 40 Down ( 下箭头 )
别名按键设置
- .delete 删除
- .tab Tab
- .enter 回车
- .esc 退出
- .space 空格
- .left 左箭头
- .right 右箭头
- .down 上箭头
- .up 下箭头
- .ctrl Ctrl
- .alt Alt
- .shift Shift
修饰符
- .stop 阻止事件冒泡 (等同于JavaScript中的
event.stopPropagation()) - .prevent 阻止默认行为 (等同于JavaScript中的
event.preventDefault()) - .self 当事件在该元素本身触发回调
- .capture 触发事件捕获
- @once 只执行一次
Vue中键盘事件的更多相关文章
- Vue_(基础)Vue中的事件
Vue.js中文文档 传送门 Vue@事件绑定 v-show:通过切换元素的display CSS属性实现显示隐藏: v-if:根据表达式的真假实现显示隐藏,如果隐藏,它绑定的元素都会销毁,显示的时候 ...
- html中键盘事件----在路上(16)
键盘事件,这里以onkeyup为例: 解析:当在一个input中输入文本时,在另一个div中输出文本 在下面是本人写的小demo,供分享. 代码如下: <!DOCTYPE html> &l ...
- Vue中的事件与常见的问题处理
Vue的事件:获取事件对象$event: 事件冒泡:事件会向上传播 原生js阻止事件冒泡,需要先获取事件对象,再调用stopPropagation()方法: vue事件修饰符stop,例@clik.s ...
- 怎样在 Vue 中使用 事件修饰符 ?
Vue 中可以通过 v-on 来绑定事件监听函数, 不过事件会有许多额外情况, 比如 是否阻止冒泡 / 是否阻止重载 / 是否限制点击次数 / 是否可以通过按键触发 等等. 这时就需要使用到 事件修饰 ...
- 第二章 Vue快速入门--9 使用v-on指令定义Vue中的事件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- vue中滚动事件绑定的函数无法调用问题
问题描述: 一个包含下拉加载的页面,刷新当前页然后滚动页面,能够正常触发滚动事件并调用回调函数,但是如果是进了某一个页面然后再进的该页面,滚动事件能够触发, 但是回调函数在滚动的时候只能被调用一次. ...
- (二)咋使用VUE中的事件修饰符
1,stop修饰符:阻止事件冒泡 首先我们要明确H5的事件是从内向外进行冒泡的,写一个简单的DEMO 当我们点击按钮时,事件从内向外冒泡,依次触发绑定的事件,控制台信息如下 现在我们在click后面添 ...
- 029——VUE中键盘语义修饰符
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue中的事件监听之——v-on vs .$on
跟着视频中老师的教学视频学vue的时候,看很多时候都用@(v-on)来监听子级emit的自定义事件,但在bus总线那块,又用.$on来监听bus自身emit的事件,v-on之间似乎相似但又不同,今天对 ...
随机推荐
- 国产化之路-麒麟V10操作系统安装.net core 3.1 sdk
随着芯片国产化,操作系统国产化,软件国产化的声浪越来越高,公司也已经把开发项目国产化提上了日程,最近搞来了台长城的国产化电脑主机,用来搞试验,安装的是麒麟V10的操作系统,国产化折腾之路就此开始,用的 ...
- java.lang.NoSuchMethodError: org.springframework.util.Assert.isTrue(ZLjava/util/function/Supplier;)V
spring-data-redis 2的版本只支持spring5和spring boot2+,建议降低spring-data-redis版本 <!-- redis --> <depe ...
- 【C#上位机必看】你们要的Iot物联网项目来了
新阁教育喜科堂不得不说,工业圈是个比较奇怪的圈子,各种各样的项目需求都有,有的人就希望价格低,功能实现即可,有的人又不在乎价格,就要界面好看.最近有一个小伙伴又提出了这样的需求,用最简单的方式,最低的 ...
- 执行引擎(Execution Engine)基础知识
概述 执行引擎是Java虚拟机的核心组成部分之一 虚拟机是一个相对于"物理机"的概念,这两种机器都有代码执行能力,其区别是物理机的执行引擎是直接建立在处理器.缓存.指令集和操作系统 ...
- [网鼎杯 2018]Comment
[网鼎杯 2018]Comment 又遇到了一道有意思的题目,还是比较综合的,考的跟之前有一道很相像,用的还是二次注入. 因为找不到登陆点的sql注入,所以扫了一下源码,发现是存在git泄露的. [2 ...
- python语言开发环境配置
原作者:龙行天下-super 地址:https://www.cnblogs.com/longxingtianxia/p/10181901.html 要点:IDLE是一个轻量级python语言开发环境, ...
- 数据类型-字符串(str)
1.只要是被单引号,双引号,三引号括起来的,都是字符串类型 2.字符串里面元素:单个字母,单个符号,都称之为一个元素 例如:s='hello!' (6个元素) len(数据)统计数据的长度pri ...
- MyBatis多对一,一对多,多对多,一对多关联查询
一.Person实体类 1 public class Person { 2 private Integer personId; 3 private String name; 4 private Int ...
- Go 指针相关
Go指针 Go语言中的指针非常简单,没有偏移和运算,只需要记住两个符号.&取变量地址与*根据地址取值. 以下是一个简单的示例: package main import ( "fmt& ...
- 大话Python函数底层逻辑
函数 叫 子过程或子程序 描叙的更为贴近实际应用场景 这和数学中的函数实现上不同但语义上相识,如 f(x) = expressiom, 给定一个确定的输入必然返回一个确定的输出 数学中函数的关系是通过 ...