vue监听键盘回车事件的三种方法

方法一:

@keydown='show()' 当然我们传个$event 也可以在函数中获 ev.keyCode

if(ev.keyCode==13){

alert('你按了回车键!')

}

1

2

3

4

方法二:

<input type="text" @keyup.enter="show()">回车执行

<input type="text" @keydown.up='show()' >上键执行

<input type="text" @keydown.down='show()' >下键执行

<input type="text" @keydown.left='show()' >左键执行

<input type="text" @keydown.right='show()' >右键执行

1

2

3

4

5

方法三:

c 复制代码
<el-button type="primary" @click="login">登录
created() {
this.keyupSubmit();
},
methods(){
keyupSubmit() {
document.onkeydown = (e) => {
let _key = window.event.keyCode;
//!this.clickState是防止用户重复点击回车
if (_key === 13&&!this.clickState) {
this.login();
}
};
},

}

相关推荐
Dontla5 小时前
前端页面鼠标移动监控(鼠标运动、鼠标监控)鼠标节流处理、throttle、限制触发频率(setTimeout、clearInterval)
前端·javascript
再学一点就睡5 小时前
深拷贝与浅拷贝:代码世界里的永恒与瞬间
前端·javascript
CrimsonHu5 小时前
B站首页的 Banner 这么好看,我用原生 JS + 三大框架统统给你复刻一遍!
前端·javascript·css
Enti7c5 小时前
前端表单输入框验证
前端·javascript·jquery
拉不动的猪5 小时前
几种比较实用的指令举例
前端·javascript·面试
与妖为邻6 小时前
自动获取屏幕尺寸信息的html文件
前端·javascript·html
sunn。6 小时前
自定义组件触发饿了么表单校验
javascript·vue.js·elementui
烛阴7 小时前
Express入门必学三件套:路由、中间件、模板引擎全解析
javascript·后端·express
哟哟耶耶7 小时前
React-01React创建第一个项目(npm install -g create-react-app)
前端·javascript·react.js
Dontla7 小时前
前端页面鼠标移动监控(鼠标运动、鼠标监控)鼠标防抖处理、mousemove、debounce()、事件停止触发、超时触发
前端·计算机外设