1、el-input绑定键盘事件不生效

错误代码:

<el-input v-model="studentvo.sname" placeholder="请输入学生姓名" style="width:20%" @keyup.enter="selectAll"></el-input>

修改后的代码:

<el-input v-model="studentvo.sname" placeholder="请输入学生姓名" style="width:20%" @keyup.enter.native="selectAll"></el-input>

原因：element-ui是封装组件所以el标签是自定义标签

解决方案：自定义标签绑定键盘事件需要加上native原生事件修饰符

2、表单只有一个输入框时绑定enter键触发事件时刷新页面

错误代码:

<el-form ref="form" label-width="80px">
    <el-form-item label="班级名">
         <el-input @keydown.enter='GoOn' v-model="classes"></el-input>
    </el-form-item>
</el-form>

修改后的代码:

<el-form ref="form" label-width="80px">
    <el-form-item label="班级名">
         <el-input @keydown.enter.prevent='GoOn' v-model="classes"></el-input>
    </el-form-item>
</el-form>

原因：表单的默认提交是enter所以触发了按键事件时会刷新页面

解决方案：加上prevent修饰符取消默认事件

本文内容仅供个人学习/研究/参考使用，不构成任何决策建议或专业指导。分享/转载时请标明原文来源，同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦～感谢您的理解与支持！

链接: https://fly63.com/article/detial/6932