版权声明：本文首发 http://asing1elife.com ，转载请注明出处。 https://blog.csdn.net/asing1elife/article/details/82711366
elementui el-form 支持回车提交
el-form 组件默认不支持回车提交，需要对提交按钮进行一下更改
更多精彩
- 更多技术博客，请移步 asing1elife’s blog
实现方式
- 在表单的提交按钮上添加 Vue 原生属性
native-type="submit"可以让按钮变为表单提交按钮 - 当表单中只有一个输入框时，按钮会默认为提交按钮
- 设置默认的提交按钮后需要阻止表单默认提交事件，在表单上添加
@submit.native.prevent即可
<el-form ref="form" :model="user" :rules="rules" class="login-form" @submit.native.prevent>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item prop="username">
<el-input v-model="user.username" placeholder="请输入用户名" autofocus>
<in-icon slot="prefix" :name="userIcon"></in-icon>
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input v-model="user.password" type="password" placeholder="请输入密码">
<in-icon slot="prefix" :name="passwordIcon"></in-icon>
</el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" native-type="submit" class="submit-btn" @click="submitForm">登录</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
