您现在的位置是: 首页 > 前端开发 Vue 监听回车 el-input 和 input 使用方法不同
Vue 监听回车 el-input 和 input 使用方法不同
2020-09-11 【前端开发】 1035人已围观 1417次浏览
简介Vue 监听回车 el-input 和 input 使用方法不同
在Vue项目中,经常会涉及到需要对某个输入框进行回车按键的监听,比如搜索框,输入完成后回车立即触发搜索事件
在普通 js 项目中,通常是这样使用的
document.onkeydown = function (e) { // 回车提交表单
var theEvent = window.event || e;
var code = theEvent.keyCode || theEvent.which;
if (code === 13) {
// 执行操作
}
};
但在 Vue 项目中,就不用这么麻烦,只需要注意下 el-input 和 input 输入框使用的方法不同即可,比如
input
<input class="input" v-model="strSearch" @keydown.enter="btnSearch">
el-input
<el-input v-model="strSearch" @keydown.enter.native="btnSearch">
el-input 相比较 input ,在 @keydown.enter 后面要多一个 native ,否则 el-input 是无法监听回车按键的
很赞哦! (0)
点击排行
- Error in execution; nested exception is io.lettuce.core.RedisCommandExecutionException: ERR DISABLE You can't write or read against a disable instance
- RocketMQ 出现 sendDefaultImpl call timeout 问题
- 类 BASE64Decoder 程序包 sun.misc 找不到符号
- Debian apt 使用国内镜像
- SpringBoot @NotBlank 不生效问题
- 记一次 Mybatis-Plus 自动填充无效问题解决
- nuxt 项目完整部署方案
- gulp3 在 node12 上运行出现异常 primordials is not defined