现象
当使用el-form时,若表单中只有一个el-input表单元素,当回车时就会发生表单的自动提交,现象为浏览器刷新,如下代码
<el-form>
<el-form-item label="付款码">
<el-input ref="isfocus" :disabled="payType != 1" placeholder="请输入付款码" v-model="pay_code"></el-input>
</el-form-item>
</el-form>
以上代码代码,当输入框输入数据后回车就会自动刷新浏览器。
原因
当表单中只有一个表单元素时,回车时表单就会默认提交。
没有阻止button的默认事件,导致表单提交到空地址,页面刷新
解决方案
阻止默认提交时间
<el-form @submit.native.prevent>
如果 el-inout 还需要使用回车事件触发可以使用下面的方式
@keyup.enter.native