查阅资料后得知,当 el-form 表单里只有一个el-input 时,按下回车建会自动触发页面提交功能,因此导致了页面的刷新。 【解决方法】 ———方法1——— 在表单中新增一个元素,使其不显示,目的在于不让 el-input 变成唯一,这样就不会引起刷新。 <el-form :model="form" ref="form" :inline="true"> <el-f...
那elementUI的解决了, 原生的form表单的单input和form包裹el-input回车刷新的问题也一样可以解决 1.在form表单内再增加一个隐藏的input框 ①通过hidden定义隐藏的输入字段 <form><inputtype="hidden"value="1"></input></form> ②通过css样式进行隐藏 <form><inputtype="text"style="display:none"></input><...
解决方法 ———方法1——— 在表单中新增一个元素,使其不显示,目的在于不让 el-input 变成唯一,这样就不会引起刷新。 <el-form:model="form"ref="form":inline="true"><el-form-itemlabel="姓名"prop="name"><el-inputv-model="form.name"@keydown.enter="handleQuery"/></el-form-item><div></...
1、问题:当element表单里面只有一个input的时候回车会刷新页面 2、原因:当el-form表单里面只有一个input时,回车会触发表单提交的默认事件 3、解决:阻止表单提交的默认事件 在表单处加上@submit.native.prevent <el-form class="main_header":inline="true":model="formModel"size="mini"slot="form"ref="commonF...
简介:elementUI/Plus 输入框按回车刷新页面分析与解决 一.如果你是在 ElementUI 或者 elementPlus 框架中使用<el-input>组件,并希望阻止回车键导致的页面刷新,你可以使用Vue的.prevent修饰符来阻止默认的表单提交行为。 <el-form-item> v-model="input" placeholder="请输入内容"> ...
element input小数 1.input回车事件不执行导致页面刷新 场景:在文本框中输入关键字按回车,页面自动刷新了 <form name="keywordForm" method="post" action=""> <p id="profile_nav"> <label for="profile"> 关键字搜索: </label> <input style="width:80; height:20" type="text" name="keyword" οn...
element ui 表单内input框回车导致界面刷新,原因:当el-form表单内只有一个el-input输入框时,在输入框内回车就会触发表单的提交事件。并且该默认监听回车是keydown,导致自己设置的监听keyup失效。解决办法:在el-form上加上@submit.native.prevent属性就可以阻止回车提交
<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="...
1、form 下面只有一个 input 时回车键刷新页面 原因是触发了表单默认的提交行为,给el-form 加上@submit.native.prevent就行了。 <el-form inline @submit.native.prevent> <el-form-item label="订单号"> <el-inputv-model="query.orderNo" :placeholder="输入订单号查询" ...
最近在项目开发中,发现el-input输入框绑定@keyup.enter回车事件之后,回车会导致刷新页面 解决方法: <el-form :inline="true" @submit.native.prevent></el-form> 参考element-ui文档: image.png W3C 标准中有如下规定: When there is only one single-line text input field in a form, the user agent ...