当前位置: 首页 > news >正文

【VUE复习·3】@keyup.xxx 键盘事件触发函数(单按键 or 组合按键触发)

总览

1.@keyup.xxx or @keydown.xxx 单按键触发
2.组合按键触发

一、@keyup.xxx or @keydown.xxx

1.用法

在我们使用 @keyup.enter 时,那么我们可以这样写:

<div><input type="text" placeholder="按下回车键以确定..." @keyup.enter="confirmInfo">
</div><script>method:{confirmInfo(e) {alert(“我是一只猫。”)}}
</script>
2.常用的 @keyup.xxx 的 xxx 有哪些

我们只要设置了 @keyup.enter 或 @keyup.delete,VUE 就能帮助我们在按下键盘上的 Enter 或 Delete 时调用函数。这在原生的 JavaScript 中,是需要自己写触发 if 条件判断的,但是 VUE 已经帮我们定义好了这些按键,只需要直接 @keyup.xxx 就可以直接使用了。

在这里插入图片描述

二、@keyup.xxx or @keydown.xxx 组合按键触发

1.用法

我们之前说了,如何使用单按键,如 Enter、Esc、Delete 等等,触发函数。现在我们要使用组合按键,如 Ctrl + y 来触发一个函数。其实写法很简单,一看就明白了:

在这里插入图片描述

http://www.lryc.cn/news/177786.html

相关文章:

  • IntelliJ IDEA学习总结(3)—— IntelliJ IDEA 常用快捷键(带动图演示)
  • 巨人互动|Facebook海外户Facebook的特点优势
  • (vue3)create-vue 组合式API
  • 【如何看待Unity收费】对标中小公司的待就业者的该如何做
  • c++迷宫小游戏
  • 需求堆积,如何排序产品优先极
  • 计算机视觉 回头重新理解图像中的矩
  • MapStruct应用实战及BeanUtils性能比较
  • ISP技术概述
  • CSDN: ABTest流量分层分桶机制
  • 【小余送书第一期】《数据要素安全流通》参与活动,即有机会中奖哦!!
  • 蓝牙核心规范(V5.4)10.7-BLE 入门笔记之L2CAP
  • VUE之正则表达式全集整理
  • Python 中的字符串基础与应用
  • C++:如何实现数组元素逆置?多种方法
  • php框架thinkPHP6的安装教程
  • PTA程序辅助实验平台——2023年软件设计综合实践_3(分支与循环)
  • 【C语言数据结构】线性表-链式存储-单链表
  • tp8 Editor.md
  • LM小型可编程控制器软件(基于CoDeSys)笔记三十一:保持变量和非保持变量
  • 「C++之STL」关于在模拟实现STL容器中的深浅拷贝问题
  • 文件内容显示
  • Milvus+Attu
  • LeetCode算法二叉树—226. 翻转二叉树
  • AI项目十:Swin Transformer目标检测环境搭建
  • 【IPC 通信】信号处理接口 Signal API(5)
  • Arduino PLC IDE
  • 记录使用iText7查找PDF内容关键字坐标,加盖电子签名、印章
  • Java8实战-总结37
  • 【超详细】前段开发之详细的Vue3入门教程,特别适合小白系统学习,入门到熟练使用Vue看这一篇就够了!