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();
}
};
},

}

相关推荐
我叫张小白。6 分钟前
Vue3监视系统全解析
前端·javascript·vue.js·前端框架·vue3
WYiQIU5 小时前
11月面了7.8家前端岗,兄弟们12月我先躺为敬...
前端·vue.js·react.js·面试·前端框架·飞书
娃哈哈哈哈呀5 小时前
formData 传参 如何传数组
前端·javascript·vue.js
513495927 小时前
Vite环境变量配置
vue.js
2503_928411567 小时前
11.24 Vue-组件2
前端·javascript·vue.js
g***B7388 小时前
JavaScript在Node.js中的模块系统
开发语言·javascript·node.js
Z***25808 小时前
JavaScript在Node.js中的Deno
开发语言·javascript·node.js
weixin79893765432...8 小时前
Vue + Express + DeepSeek 实现一个简单的对话式 AI 应用
vue.js·人工智能·express
高级程序源9 小时前
springboot社区医疗中心预约挂号平台app-计算机毕业设计源码16750
java·vue.js·spring boot·mysql·spring·maven·mybatis
cypking9 小时前
Vue 3 + Vite + Router + Pinia + Element Plus + Monorepo + qiankun 构建企业级中后台前端框架
前端·javascript·vue.js