键盘事件：

　　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中键盘事件的更多相关文章

  1. Vue_(基础)Vue中的事件

    Vue.js中文文档 传送门 Vue@事件绑定 v-show:通过切换元素的display CSS属性实现显示隐藏: v-if:根据表达式的真假实现显示隐藏,如果隐藏,它绑定的元素都会销毁,显示的时候 ...

  2. html中键盘事件----在路上（16）

    键盘事件,这里以onkeyup为例: 解析:当在一个input中输入文本时,在另一个div中输出文本 在下面是本人写的小demo,供分享. 代码如下: <!DOCTYPE html> &l ...

  3. Vue中的事件与常见的问题处理

    Vue的事件:获取事件对象$event: 事件冒泡:事件会向上传播 原生js阻止事件冒泡,需要先获取事件对象,再调用stopPropagation()方法: vue事件修饰符stop,例@clik.s ...

  4. 怎样在 Vue 中使用 事件修饰符 ?

    Vue 中可以通过 v-on 来绑定事件监听函数, 不过事件会有许多额外情况, 比如 是否阻止冒泡 / 是否阻止重载 / 是否限制点击次数 / 是否可以通过按键触发 等等. 这时就需要使用到 事件修饰 ...

  5. 第二章 Vue快速入门--9 使用v-on指令定义Vue中的事件

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  6. vue中滚动事件绑定的函数无法调用问题

    问题描述: 一个包含下拉加载的页面,刷新当前页然后滚动页面,能够正常触发滚动事件并调用回调函数,但是如果是进了某一个页面然后再进的该页面,滚动事件能够触发, 但是回调函数在滚动的时候只能被调用一次. ...

  7. （二）咋使用VUE中的事件修饰符

    1,stop修饰符:阻止事件冒泡 首先我们要明确H5的事件是从内向外进行冒泡的,写一个简单的DEMO 当我们点击按钮时,事件从内向外冒泡,依次触发绑定的事件,控制台信息如下 现在我们在click后面添 ...

  8. 029——VUE中键盘语义修饰符

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. vue中的事件监听之——v-on vs .$on

    跟着视频中老师的教学视频学vue的时候,看很多时候都用@(v-on)来监听子级emit的自定义事件,但在bus总线那块,又用.$on来监听bus自身emit的事件,v-on之间似乎相似但又不同,今天对 ...

随机推荐

  1. JVM--先说本地方法接口

    本地方法接口 在讲Java虚拟机运行时数据区中本地方法栈之前,我们先来说说运行时数据区之外的一个叫本地方法接口的东西简称JNI(Java Native Interface) 简单来讲,一个Native ...

  2. springboot之零碎小知识

    1.springboot启动类加载yml配置项 主要是如下方法,读取了yml的配置项,赋值为类成员属性 @Autowired public void setEnvironment(Environmen ...

  3. 绝了！一个妹子 rm -rf 把公司整个数据库删没了...

    经历了两天不懈努力,终于恢复了一次误操作删除的生产服务器数据.对本次事故过程和解决办法记录在此,警醒自己,也提示别人莫犯此错.也希望遇到问题的朋友能找到一丝灵感解决问题. 01 事故背景 安排一个妹子 ...

  4. Nginx 配置 HTTPS 完整过程(阿里云申请免费版一年ssl证书)

    1. nginx 的 ssl 模块安装 查看 nginx 是否安装 http_ssl_module 模块. $ /usr/local/nginx/sbin/nginx -V 如果出现 configur ...

  5. FTL指令常用标签及语法

    FTL指令常用标签及语法注意:使用freemaker,要求所有标签必须闭合,否则会导致freemaker无法解析. freemaker注释:<#-- 注释内容 -->格式部分,不会输出 - ...

  6. Elasticsearch（1）：基础入门

      1 Elasticsearch¶   在如今数据为王的时代,如何充分高效实现数据检索和分析是数据应用的关键.以电商平台为例,输入一个商品名称,那么就要求系统以最快的速度将所有相关的商品搜索处理.现 ...

  7. Element-UI:级联选择器：Cannot read property 'level' of null"

    当级联选择时如果其选择内容需要动态变化时,如果没有选择就不会报错的:而当做出选择后又要动态变化级联选择器内容时,就会报错/ 错误:这个错误的原因是当选择后,再更新内容时,选择器仍会关联原来的数据,导致 ...

  8. SQL Server通过创建临时表遍历更新数据

    前言: 前段时间新项目上线为了赶进度很多模块的功能都没有经过详细的测试导致了生成环境中的数据和实际数据对不上,因此需要自己手写一个数据库脚本来更新下之前的数据.(线上数据库用是SQL Server20 ...

  9. 解决npm被墙的问题

    npm存储包文件的服务器在国外,有时候会被墙,速度很慢,所以我们需要解决这个问题. http://npm.taobao.org/  淘宝的开发团队把npm在国内做了一个备份. 安装淘宝的cnpm np ...

  10. 能否使用GHDL+GTKWave代替Quartus ii

    能否使用GHDL+GTKWave代替Quartus ii macOS High Sierra系统 10.13.6 [toc] 先给出答案 可以替代一部分功能 如果你是一个学工科的学生,正在学习EDA. ...