您现在的位置是: 首页 > 前端开发 Vue 监听回车 el-input 和 input 使用方法不同

Vue 监听回车 el-input 和 input 使用方法不同

2020-09-11 前端开发 164人已围观 181次浏览

简介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)

随机好物推荐

站长推荐

站点信息

  • 网站地图