方法一:

element-ui的input组件内部有input元素,可以给el-input设置ref属性,然后this. r e f s . i n p u t . refs.input. refs.input.el.querySelector(‘input’) 获取内部input属性从而调用blur事件,从而实现点击回车失去焦点。
以上一篇文章为例,vue登录页面实现回车登录
body:

<el-input
	ref="input"
	v-model="personInfo.personId"
	placeholder="请输入卡号"
	class="form-item"></el-input>

js部分:

// 创建成功后来定义回车事件
    created () {
        document.onkeydown = (e) => {
            if (window.event === undefined) {
                var key = e.keyCode
            } else {
                // eslint-disable-next-line no-redeclare
                var key = window.event.keyCode
            }
            if (key === 13) {
                //  输入身份证按下回车后鼠标失去焦点
                this.$refs.input.$el.querySelector('input').blur()
            }
        }
    }
方法二:

直接在el-input标签加上οnkeypress=“if(window.event.keyCode==13) this.blur()”

<el-input
	ref="input"
	v-model="personInfo.personId"
	placeholder="请输入卡号"
	class="form-item"
	onkeypress="if(window.event.keyCode==13) this.blur()"></el-input>
Logo

前往低代码交流专区

更多推荐