问题描述
当el-input 获取焦点后按到回车按钮会刷新当前页面
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
<el-form-item label="关键字">
<el-input v-model.trim="queryParams.keyword" placeholder="请输入" clearable></el-input>
</el-form-item>
<el-form-item class="el-btn-box">
<el-button class="el-btn-search" type="primary" icon="custom-icon-search" size="mini" @click="handleQuery" :loading="loading">查询</el-button>
</el-form-item>
</el-form>
问题解决文章来源:https://www.toymoban.com/news/detail-706489.html
在el-form标签增加表单事件@submit.native.prevent,防止搜索框回车键刷新整个页面文章来源地址https://www.toymoban.com/news/detail-706489.html
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" @submit.native.prevent>
<el-form-item label="关键字">
<el-input v-model.trim="queryParams.keyword" placeholder="请输入" clearable></el-input>
</el-form-item>
<el-form-item class="el-btn-box">
<el-button class="el-btn-search" type="primary" icon="custom-icon-search" size="mini" @click="handleQuery" :loading="loading">查询</el-button>
</el-form-item>
</el-form>
到了这里,关于Element UI 中el-input 框回车触发页面刷新问题及解决的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!