v-on监听事件时可添加按键修饰符

<!-- 只有在 `key` 是 `Enter` 时调用 `vm.submit()` -->
<input v-on:keyup.enter="submit">

使用 keyCode 特性也是允许的:

<input v-on:keyup.13="submit">

还可以通过全局 config.keyCodes 对象自定义按键修饰符别名:

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

Vue 提供了绝大多数常用的按键码的别名:

  • .enter
  • .tab
  • .delete (捕获“删除”和“退格”键)
  • .esc
  • .space
  • .up
  • .down
  • .left
  • .right

vue.js(13)--按键修饰符的更多相关文章

  1. vue 自定义全局按键修饰符

    在监听键盘事件时,我们经常需要检查常见的键值.Vue 允许为 v-on 在监听键盘事件时添加按键修饰符: JS部分: Vue.config.keyCodes = { f2:113, } var app ...

  2. vue.js实战——.native修饰符

    https://blog.csdn.net/qq_29468573/article/details/80771625 除了用v-on在组件上监听自定义事件外,也可以监听DOM事件,这时可以用.nati ...

  3. 「Vue」自定义按键修饰符

    vue.config.keyCodes.f2 = 113 设置完成后就可以绑定f2的按键操作@keyup.f2="add" 自带的有enter esc delete 空格 上下左右 ...

  4. Vue学习笔记十一:按键修饰符和自定义指令(钩子函数)

    目录 padStart:补位 按键修饰符 Vue提供的按键修饰符 自定义按键修饰符 自定义指令 自定义指令的使用 钩子函数 钩子函数参数 使用钩子函数的bingding参数 私有自定义指令 钩子函数的 ...

  5. vue学习 `${HH}-${mm}-${dd}` 按键修饰符

    vue 有一种拼接字符串的规范写法 //键盘 Tab 键 上边的键 英文输入状态 然后采用类似EL表达式${变量}return `${}:${}:${}` //有时候我们经常在输入完密码之后,按回车E ...

  6. 从零开始学 Web 之 Vue.js(二)过滤器,按键修饰符,自定义指令

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  7. Vue.js-06:第六章 - 按键修饰符的使用

    一.前言  上周末的时候,准备试试将 ASP.NET Core 的项目部署到 CentOS 服务器上,结果在一个接一个坑里面跳,最后 Supervisor 守护程序还是有问题,于是,采用重装系统大招, ...

  8. Vue之@click、事件修饰符@click.stop与@click.prevent、按键修饰符@keyup.enter

    1.绑定监听@click: (以监听click为例,其他如keyup,用法类似)  v-on:click="fun"  @click="fun"  @click ...

  9. 第二章 Vue快速入门-- 28 自定义按键修饰符

    事件处理-按键修饰符 js 里面的键盘事件对应的键码 <!DOCTYPE html> <html lang="en"> <head> <m ...

随机推荐

  1. jquery-时间轴滑动

    效果预览图: html: <div class="tim"> <div class="timdiv"> <div class=&q ...

  2. .Net手动实现ORM及代码生自动成器

    序言 代码生成器 同时提供便捷的开发管理功能和多项开发工作中常用到的辅助工具功能,您可以很方便轻松地进行项目开发,让软件开发变得轻松而快乐!帮您快速开发项目,缩短开发周期,减少开发成本,大大提高了企业 ...

  3. Android 输入法截取key优先于view

    为了验证编写了个例子 首先是输入法 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 public class RemoteKeyboard exte ...

  4. kibana的安装和监控

    1.1:kibana搭建 kibana只需要在一台机器安装即可 1):解压 tar -zxvf kibana-5.5.2-linux-x86_64.tar.gz -C /home/angel/serv ...

  5. [CSP-S模拟测试]:毛二琛(DP)

    题目描述 $MYC$在$NOI2018$中,遇到了$day1T2$这样一个题,题目是让你求有多少“好”的排列.$MYC$此题没有获得高分,感到非常惭愧,于是回去专心研究排列了.如今数排列的题对$MYC ...

  6. mysql分组,行转列

    aaarticlea/jpeg;base64,/9j/4QEsRXhpZgAASUkqAAgAAAAPAJqCCgABAAAAwgAAABABAgAQAAAAygAAAAABAwABAAAAQBAAA

  7. java虚拟机规范-运行时栈帧

    前言 java虚拟机是java跨平台的基石,本文的描述以jdk7.0为准,其他版本可能会有一些微调. 引用 java虚拟机规范 java虚拟机规范-运行时数据区 java内存运行时的栈帧结构 java ...

  8. CMD模块打包部署总结

    目前线上系统利用Seajs做模板化,但是没有对js和css进行打包,在这次简历搜索优化项目里我尝试对gulp插件对Seajs模块打包. 安装gulp和相关插件 npm install -g gulp ...

  9. Mysql数据库密码忘记的解决办法

    密码忘记——破解密码 跳过授权方式,直接登录!! 1.以管理员身份打开cmd 2.停掉mysql服务端 C:\WINDOWS\system32>net stop mysql MySQL 服务正在 ...

  10. 阶段1 语言基础+高级_1-3-Java语言高级_06-File类与IO流_02 递归_4_练习_递归打印多级目录

    递归所有的文件夹,并把文件都输出出来. 在最上面打印目录的名称