1原因 是因为当form表单中只有一个input时,按下回车建会自动触发页面的提交功能, 所以会产生刷新页面的行为 解决方案: <el-form :model="queryData"ref='queryData'status-icon @submit.native.prevent> <el-form-item label="菜单"label-width="100px"prop="menuName"> <el-inputtype="text"v-model="que...
当el-form 里边只有一个el-form-item的时候,输入内容回车刷新整个页面。 代码语言:javascript 复制 <el-form:model="queryParams"ref="queryRef"><el-form-item label="文章类型"prop="typeName"><el-input v-model="queryParams.typeName"placeholder="请输入文章类型名称"clearable @keyup.enter="handleQuery"/...
当表单中只有一个input,按回车默认是执行提交表单事件,如果是两个input不会出现这个问题。那如何解决呢?在el-form上加@submit.native.prevent阻止默认事件。如果需要回车查询数据,给el-input加@keyup.enter.native="queryInfo"属性,其中queryInfo是查询数据的函数。 <el-form ref="form" :model="form" size="mini...
1、问题:当页面只有一个输入框时,获取焦点时,点击回车整个页面被刷新了 <el-form:model="Form"label-width="100px"><el-form-itemlabel="名称"><el-inputv-model="Form.name"></el-input></el-form-item></el-form> 上面的结构是正常的,但是当输入框获取焦点,并回车后。整个页面都被刷新了,这并不...
先以html为例,el-input雷同(el-input在最后～) 1、场景 如果form表单中,只要有一个可输入的输入框,输入内容后回车(enter键)会默认提交整个表单(浏览器默认行为)。 网上说表单中只有一个输入框时回车才会触发表单提交,但是我试了输入框+按钮、输入框+多选、输入框+隐藏域,只要在输入框中回车就会提交整个表单,但...
当el-form 里边只有一个el-form-item的时候,输入内容回车刷新整个页面。 <el-form:model="queryParams"ref="queryRef"><el-form-itemlabel="文章类型"prop="typeName"><el-inputv-model="queryParams.typeName"placeholder="请输入文章类型名称"clearable@keyup.enter="handleQuery"/></el-form-item></el-form...
一、问题背景 在一个form表单中,若只有一个input,按回车键表单会自动提交,但是当表单中存在多个input时,按回车键不会执行任何操作,这是form表单的一个特性。 1、问题描述及触发条件: 当 el-form 中 有且只存在一个input时,在这个input中回车会触发默认提交事件,可能
一个 input 那么回车会自动触发 form 的 submit 回调。<el-form @submit.native="onSubmit"> 参考：https://blog.csdn.net/qq_36370731/article/details/80590387 多个 input 那么需要在 input 上添加回车监听回调。<el-input @keyup.enter.native="onSubmit"> 参考：https://forum.vuejs.org/t/how-to-...
在Element UI中,el-form组件本身并没有直接绑定回车事件,但表单中的输入框(如el-input)会监听回车事件。如果输入框是表单中的唯一输入元素,按照W3C标准,按下回车将触发表单提交,这可能导致页面刷新。 2. 阻止回车事件的默认行为 为了阻止表单提交导致的页面刷新,可以在el-form组件上添加@submit.native.prevent事件修...
<el-form-item class="block-item" label="名称" prop="name"> <el-input v-model="DepartmentForm.name" size="small"></el-input> </el-form-item> </el-form> https://blog.csdn.net/m0_46938695/article/details/105559919