el-form-item标签加prop后el-input无法输入文字处理

最新推荐文章于 2024-08-01 15:17:49 发布
最新推荐文章于 2024-08-01 15:17:49 发布
阅读量3.1k 收藏 1
点赞数 1
分类专栏： bug小记 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/keeplearnzhangxiaobo/article/details/118677957
版权
在审查前同事的代码时，发现一个使用Element UI的el-input输入框无法正常输入。问题出在缺少了`prop`属性与`Form`组件的`model`字段绑定。为Form组件补充相应的字段后，输入框功能恢复正常。这是一个关于前端开发中Vue.js和Element UI组件使用常见的问题。
摘要由CSDN通过智能技术生成

今天修改之前同事代码， 发现el-input输入框无法输入。

代码如下

 https://element.eleme.cn/2.0/#/zh-CN/component/form

prop表单域 model 字段，在使用 validate、resetFields 方法的情况下，该属性是必填的string传入 Form 组件的 model 中的字段

需要Form 组件的 model 中的字段。但是同事的form组件里面并没有该字段，所以导致input无法输入。对Form 组件进行补充后解决

Haocaibo
关注
专栏目录
Vue -- 表单下的input框无法输入内容 & 实现自动布局三等分的基于 el-form 的动态表单 & el-select 简单实践
支棱起来
05-03 1734
<el-row> <el-col :span="8" style="margin-top:15px;"> <el-form-item :label="$t('labels.deployTemp')" prop="templateName"> <el-input v-model="item.templateName" :disabled="tr...
【ElementUI 表单校验】一个 el-form-item 下多个表单校验（循环校验）
前端知识分享喵
06-07 3720
前端开发项目的过程中，批量表单循环校验是很常见的，如上图，动态添加奖励计算规则，把所有的表单放到了一个 el-form-item 下。也可以理解为 el-form-item 做了嵌套，外层当然也可以省略，样式做微调，下面通过代码来详细的看一下。不足之处，多多交流。
Vue3 form表单赋值后，input输入框无法输入
最新发布
qq_39691676的博客
08-01 567
原因: 使用reactive生成的响应式数据，在直接赋值时把响应式数据给替换为了普通数据了，导致无法监听数据的变化。Form表单及JS中的使用都需要 “paramr.formUser” 进行调用。
Element表单中输入框无法输入
你的阿迁
06-13 2386
一开始我以为是响应式丢失的问题，然后在侦听器中通过set处理这个输入框的数据，这时候已经生效了，但是在多个下拉框多次选择数据及弹层打开关闭的情况下，依然存在之前不能输入的情况。：所遇到的问题是，在表单中有部分输入框是根据下拉框所选择的数据来显示和隐藏的，这时候就遇到有的输入框存在不能输入的问题（可以聚焦，但是输入无效）：在输入框的input事件中调用$forceUpdate() 进行强制刷新。
vue中el-form下的el-input无法输入的问题
Jxiaowei的博客
04-27 2231
vue中el-form下的el-input无法输入的问题
el-form动态增减数据的问题，编辑时候input输入不了
m0_52611940的博客
10-23 531
el-form动态增减数据的问题，编辑时候input输入不了
el-table，el-form在vue中封装组件化，含操作按钮和插槽.pdf
12-16
根据字段类型，可以创建不同类型的输入控件，如`el-input`、`el-date-picker`、`el-month-picker`、`el-button`和`el-select`。例如，`el-input`用于文本输入，`el-date-picker`用于日期选择，`el-button`用于触发...
el-form-item内 循环el-form-item el-form-item输入内容了,但是失去叫焦点为什么会校验
01-16
el-form-item内循环el-form-item时，如果输入内容后失去焦点，仍然会进行校验的原因是因为el-form-item内部的el-form-item会继承父级el-form-item的校验规则。所以即使子级el-form-item输入了内容，但是失去焦点后，...
vue中使用element-ui的表单验证功能，:rules，prop，el-form-item，el-form
weixin_44708328的博客
03-23 6850
1.在 <el-form> 标签中绑定 :rules=“方法名称”,然后在 data 里写规则 2.2.在 <el-form-item> 标签绑定 prop=“规则名” <template> <!-- 登陆表单区域 --> <el-form :model="loginForm" :rules="loginFor...
el-form-item 校验指定prop
01-04
el-form-item 校验指定 prop 的方法如下： 1. 首先，在 el-form-item 中设置 prop 属性，该属性的值应与要校验的字段在表单数据对象中的属性名一致。 ```html <el-form-item label="用户名" prop="username"> <el...
element-form表单不能连续输入
weixin_57011137的博客
05-16 450
有的时候我们在做from表单的时候，修改完绑定的v-model后会出现无法连续输入内容，即点击框输入后，内容上不去 这个时候我们只需要吧el-form中的ref删除就好了 <el-form :model="numberValidateForm" class="demo-ruleForm"> <el-form-item label="年龄" prop="name" :rules="[ { required: true, message: '年龄不能为
vue3+element-plus 表单输入框无法输入
veceny的博客
03-12 4417
【代码】vue3+element-plus 表单输入框无法输入。
vue3.0+elementPlus表单无法输入问题
六国破灭，非兵不利 ，战不善，弊在赂秦。赂秦而力亏，破灭之道也。或曰：六国互丧，率赂秦耶？曰：不赂者以赂者丧，盖失强援，不能独完。故曰：弊在赂秦也。 秦以攻取之外，小则获邑，大则得城。较秦之所得，与战胜而得者，其实百倍；诸侯之所亡，与战败而亡者，其实亦百
02-14 1562
<el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="110px" class="demo-ruleForm" v-loading="loading"> <el-row > <el-col :span="24"> <el-form-item label="网点选择.
el-input无法输入情况汇总（记录一下）
weixin_43936040的博客
08-16 8265
有加form的表单校验，然后输入框无法数据的情况 整个页面是一个form表单嵌套着 红色部分是看情况增加，如果不点新增那它也可以没有，点了新增里面的input就成了必填 这里data 声明里是这样的，addAccountPOS 数组就是红色方框部分就是绑定的数组做了循环 subForm: { updateSupplierName: '', billsType: 'UPDATE', accountVOs
vue中form中字段无法输入
生而为人我很抱歉
11-03 366
vue中字段无法输入，原因是data中未定义该字段。
element组件form表单输入框输入内容不回显
你怎么也喜欢嘴巴嘟嘟
03-31 3197
果然 vue3 还是有很多问题 使用一个element-plus 还是有很多问题 比如 我刚遇到的 输入到表单 无法回显问题 暂时无解，可能还是不如了解，但是使用了强刷新只有 数据是回显了 暂时还没遇到问题 <el-form :model="UserObj" :rules="rules" ref="UserObj" label-width="80px" status-icon
el-form循环el-form-item多个类型input并进行动态验证
weixin_50903388的博客
03-07 1484
【代码】el-form循环el-form-item多个类型input并进行动态验证。
el-form-item prop属性动态绑定不生效
weixin_45890564的博客
07-30 3322
做项目时表单有一项需要有条件展示是否校验,于是首先就想到prop动态绑定,如下 但是试了好几遍都不生效,最后改成rules动态绑定校验就OK了
记录el-form输入之后不显示的一种情况
qq_42920270的博客
01-25 680
不规范的初始化模型的方式导致的模型绑定的表单项无法正常输入的案例分享
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值