Vue--按键修饰符（逐个学习按键修饰符）
在监听键盘事件时，我们经常需要检查常见的键值。Vue 允许为 v-on 在监听键盘事件时添加按键修饰符：
<!-- 只有在 `keyCode` 是 13 时调用 `vm.submit()` -->
<input v-on:keyup.13="submit">
记住所有的 keyCode 比较困难，所以 Vue 为最常用的按键提供了别名：
<!-- 同上 -->
<input v-on:keyup.enter="submit"> <!-- 缩写语法 -->
<input @keyup.enter="submit">
全部的按键别名：
.enter.tab.delete(捕获“删除”和“退格”键).esc.space(空格键).up.down.left.right
我们也可以自定义按键
<html>
<head>
<title>Vue按键修饰符</title>
<script src="vue.js"></script>
<style type="text/css">
</style>
</head>
<body>
<div id="example">
<ul>
<li v-for="item in items">
{{ item.name }}
</li>
</ul>
<button @keyup.f1="del()">删除</button>
</div>
<script>
Vue.config.keyCodes.f1 = 112;
new Vue({
el:"#example",
data:{
items:[
{name:"Hello"},
{name:"world"},
{name:"喜欢"},
{name:"happy"}
]
},
methods:{
del(){
this.items.pop();
}
}
})
</script>
甚至可以这样添加多个
Vue.config.keyCodes = ｛
f1:112,
// 可以添加多个
............
............
............ ｝
Vue--按键修饰符（逐个学习按键修饰符）的更多相关文章
- Vue--事件处理（逐个学习事件修饰符）
.capture .self .once 主要学习这三个事件修饰符的用法先来看看capture capture即是给元素添加一个监听器,当元素发生冒泡时,先触发带有该修饰符的元素.若有多个该修饰符,则 ...
- Vue.js-03：第三章 - 事件修饰符的使用
一.前言 熟悉了 Vue 的指令系统后,在实际开发中,不可避免的会使用到对于事件的操作,如何处理 DOM 事件流,成为我们必须要掌握的技能.不同于传统的前端开发,在 Vue 中给我们提供了事件修饰符这 ...
- 有关static静态修饰符的学习心得
初学java,面对着这个static修饰符,愣是琢磨了两天时间,还在今天琢磨透了,现在将悟到的东西记录下来: 1.static修饰符表示静态修饰符,其所修饰的内容(变量.方法.代码块暂时学到这三种)统 ...
- vue--键盘修饰符以及自定义键盘修饰符
键盘修饰符以及自定义键盘修饰符 1.vue键盘修饰符[了解即可] 地址:https://cn.vuejs.org/v2/guide/events.html#%E6%8C%89%E9%94%AE%E4 ...
- 对于形式参数只能用final修饰符，其它任何修饰符都会引起编译器错误
在Java中修饰符总共有一下几种: 1.访问控制修饰符 分别有:public private protected,缺省 2.其它修饰符 分别有:abstract,final,stati ...
- Java从入门到放弃——05.修饰符static,final,权限修饰符
本文目标 static final: 权限修饰符:public,private,protected,缺省 1.static 静态修饰符,被static修饰的变量或者方法会被加载进静态区内存,不需要创建 ...
- 初学总结--------Java修饰符与修饰关键字（且叫修饰关键字）
Java中有类,有成员变量,有成员方法,有局部变量.他们分别能用什么来修饰? 目前学习到的类,有普通类和内部类. 一.修饰普通类: 1.public 每个文件中只有一个类能被public修饰,表示可 ...
- js-ES6学习笔记-修饰器
1.修饰器对类的行为的改变,是代码编译时发生的,而不是在运行时.这意味着,修饰器能在编译阶段运行代码. 2. function testable(target) { target.isTestable ...
- 接口中字段的修饰符：public static final（默认不写） 接口中方法的修饰符：public abstract（默认不写）abstract只能修饰类和方法 不能修饰字段
abstract只能修饰类和方法 不能修饰字段
随机推荐
- iconfont的三种使用方式
这篇文章主要介绍了iconfont的三种使用方式,需要的朋友可以参考下 在我们项目中经常要使用到iconfont,在此我们使用阿里巴巴矢量库提供的icon图标,此图标库足够为我们提供大量的图标,我 ...
- POJ 3259 Wormholes ( SPFA判断负环 && 思维 )
题意 : 给出 N 个点,以及 M 条双向路,每一条路的权值代表你在这条路上到达终点需要那么时间,接下来给出 W 个虫洞,虫洞给出的形式为 A B C 代表能将你从 A 送到 B 点,并且回到 C 个 ...
- Jenkins报错：该Jenkins实例似乎已离线
解决方法: 1.保留此离线页面,重新开启一个浏览器tab标签页 2.输入输入网址http://localhost:8080/pluginManager/advanced 3.进入该页面最底下,找到[升 ...
- UE4-PS4开发渲染线程优化方法及记录
先说方法: Launch 到 PS4 Devkit上,在PS4上输入Stat unit 看瓶颈在哪里.我们发现Frame 和Draw数值几乎一样,其余两项相对较小,这表明瓶颈在渲染线程上. 关于渲染线 ...
- <R语言编程艺术>的一个错误以及矩阵相加
R语言编程艺术讲矩阵这节时,举了个随机噪声模糊罗斯福总统画像的例子.但是里面似乎有个错误,例子本意是区域外的值保持不变,而选定区域的值加一个随机值,但是实际情况是两个行列不相等的矩阵相加,会报错,如果 ...
- Jsoup代码示例、解析网页+提取文本
使用Jsoup解析HTML 那么我们就必须用到HttpClient先获取到html 同样我们引入HttpClient相关jar包 以及commonIO的jar包 我们把httpClient的基本代码写 ...
- STM32 ADC基础与多通道采样
12位ADC是一种逐次逼近型模拟数字数字转换器.它有多达18个通道,可测量16个外部和2个内部信号源.ADC的输入时钟不得超过14MHZ,它是由PCLK2经分频产生.如果被ADC转换的模拟电压低于低阀 ...
- PHP 数组下标自动转换为整型的坑
在做项目时,上线后遇到一个 BUG,有一个数组存储了下标从 '01'到'18' 总共18组数据.上线前测试了前几组数据,没问题.上线后,在用户选择'15'时报错,找不到这个数据.查了一下代码,数据是没 ...
- Naive Bayes Algorithm And Laplace Smoothing
朴素贝叶斯算法(Naive Bayes)适用于在Training Set中,输入X和输出Y都是离散型的情况.如果输入X为连续,输出Y为离散,我们考虑使用逻辑回归(Logistic Regression ...
- Vulhub搭建
Vulhub是一个比较全面的漏洞集合,收集了近年来许多的重要漏洞,以开源的形式呈现,以docker的形式进行环境配置,提供了更简单的漏洞复现,只需要简单的命令即可实现漏洞复现. 官网 https:/ ...