试了好几种方法无效,分享一下成功的方法,仅供参考。
mounted 中新增:
mounted() {
window.addEventListener('keyup' ,this.loginEnter,false)
}
methods 中新增:
methods: {
// 绑定回车键登录 ,建议13,和100都用上
loginEnter(event) {
if (event.keyCode === 13 || event.keyCode === 100) {
this.login() // login是你自己写的登录方法
},
login(){
// 这是你自己写的登录判定
}
},
在中新增:@submit.native.prevent=“loginEnter”
注意最好带上 loginEnter 方法。有些人的方法直接让粘贴@submit.native.prevent,这个在 vue2 中好像无法识别。
<el-form @submit.native.prevent="loginEnter" :model="user" :rules="rules" ref="userForm" >
</el-form>
在你所有 el-input 标签中添加@keyup=“loginEnter”
<el-form-item prop="username">
<el-input size="lager" style="margin: 10px 0;" prefix-icon="el-icon-user" placeholder="请输入用户名/工号"
v-model="user.username"
@keyup="loginEnter"></el-input>
</el-form-item>
<el-form-item prop="password">
<el-input size="medium" style="margin: 10px 0" prefix-icon="el-icon-lock" show-password placeholder="请输入密码"
v-model="user.password" @keyup="loginEnter"></el-input>
</el-form-item>
<el-form-item prop="验证码">
<div style="display: flex">
<el-input size="medium" style="margin: 5px 0;width: 180px;margin-right: 20px" prefix-icon="el-icon-key"
v-model="form.validCode" placeholder="点击图片更换验证码" @keyup="loginEnter"></el-input>
<valid-code @input="createValidCode" style="margin:5px 0;height:50px;background-color: #f0f0f0"/>
</div>
</el-form-item>