一 概述
- 什么是@keyup
- @keyup.esc示例
- @keyup.enter示例
二 什么是@keyup
@keyup(键盘事件)是按键松开,当指定的按键松开会触发的事件
事件代码 | 事件描述 |
---|---|
@keyup.enter | 回车按键松开 |
@keyup.left | 左键按键松开 |
@keyup.right | 右键按键松开 |
@keyup.up | 上键按键松开 |
@keyup.down | 下键按键松开 |
@keyup.delete | 删除键松开 |
@keyup.esc | esc键松开 |
三 @keyup.esc示例-输入框按ESC时清空输入框
3.1 布局代码
<div id="app">
<input type="text" @keyup.esc="clearInput">
</div>
3.2 vue代码
clearInput(e){
e.target.value=''
console.log("clearInput")
},
3.3 效果图
四 @keyup.enter示例-输入框按enter键提交内容
4.1 布局代码
<div id="app">
<input type="text" @keyup.enter="submit">
</div>
4.2 vue代码
submit(){
console.log('submit')
}