element ui 踩坑 input 有值却一直显示错误提示

最新推荐文章于 2023-07-14 18:26:59 发布
最新推荐文章于 2023-07-14 18:26:59 发布
阅读量801 收藏
点赞数
分类专栏： element-ui 文章标签： ui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43918803/article/details/122596707
版权

input 有值却一直显示错误提示

如下图：
在这里插入图片描述
问题原因：

form中不包含此属性(在方法中对form表单数据处理漏掉属性)

在这里插入图片描述

解决方案
将缺少属性补充完整

小鱼仔么么
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
elementUI from表单必填项已有值但是提示信息还在
zhengyun1568的博客
11-18 5582
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> <el-form-item label="活动名称" prop="name"> <el-input v-model="ruleForm.name"></el-input> </el-form-item> <el-form-it
vue element-ui实现input输入框金额数字添加千分位
10-15
主要介绍了vue element-ui实现input输入框金额数字添加千分位,本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
vue element ui validate 主动触发错误提示操作
10-14
主要介绍了vue element ui validate 主动触发错误提示操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
解决el-input输入，鼠标离开表单验证一直报错
DongShanYuXiao的博客
12-07 527
解决el-input输入，鼠标离开表单验证一直报错
Element UI进行表单校验的时候，输入正确内容后，还有提示问题
weixin_52727969的博客
03-31 5641
默认情况下，一个组件上的 v-model 会把 value 用作 prop 且把 input 用作 event，但是一些输入类型比如单选框和复选框按钮可能想使用 value prop 来达到不同的目的。1.看看你的el-form 是否绑定了值model并且model后面的名称是否和你后面表单输入时使用的名称相同；2.el-form 是否绑定了验证规则：rules(起个名字我们的提示信息就是在这里面写的)字眼表明其主要的使用场景是在组件内部，后面的那一大段是说明缘由的。的值是否和rules的值对应。
【Vue+ElementUI】解决表单校验填写完成仍然有提示
栀妹儿的炼丹炉
02-08 1332
<el-form :rules="rules" ref="addForm" v-model="addForm" label-width="100px"> <el-form-item label="作者：" prop="author"> <el-input v-model="addForm.author"></el-input> </el-form-item> </el-form> addForm:{auth
使用element表单校验必填错误的解决方法(表单有值但是一直提示错误)
my466879168的博客
03-10 1万+
表单校验错误(input框有值提交的时候一直提示错误) 昨天做了一个element表单的必输项，当时还能用，现在就用不了了，输入了值一直报错未输入，如下所示： [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-hDRp1808-1583853736237)(http://image-static.codingdylan.com/img/Snipaste_2020-03-...
解决vue+ element ui 表单验证有值但验证失败问题
10-15
主要介绍了vue+ element ui 表单验证有值但验证失败，本文通过实例代码给大家分享解决方案，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下
vue Element-ui input 远程搜索与修改建议显示模版的示例代码
10-19
本文分为html，js和css代码给大家详细介绍了vue Element-ui input 远程搜索与修改建议显示模版功能，感兴趣的朋友一起看看吧
el-input 值为数字时rule提示不正确问题
brighthuacon的专栏
12-27 1001
el-input 值为数字时rule提示不正确问题
解决在element form中输入了内容，却依旧显示，你没有输入内容的问题
m0_51092575的博客
10-15 1756
解决在element form中输入了内容，却依旧显示，你没有输入内容的问题
关于element-ui form表单必填项已经选入值并回填了，但是还会报错必填提示
m0_59157023的博客
06-20 2654
今天用el-form表单的时候 发现明明已经选入值并回填了 发现还是会触发必填报错。因为我这里是点击后右边是一个select选项帮助。这里代表的是只有blur的时候才触发rule规则。经过发现，是因为rule表单触发校验规则。但是我选择应该是change事件。
element-ui表单校验成功，一直发出警告
shsyzhzhgn的博客
07-14 557
表单校验成功validate返回true,控制台报错，警告信息fieldValue:“”
Element 表单验证绑定元素后发现rule不生效，required必填报错，input内填了值也报错
m0_55835540的博客
07-23 5086
遇到element 表单验证 绑定后无论输入与否都会提示内容必填
input输入框验证规则trigger遇到的bug有值却仍然显示不通过 vue与elementUI
00年女程序员分享自己的学习笔记
09-14 2753
点击input输入框出现弹框，弹框选择数据之后，input输入框回显数据，但是trigger使用blur，此时验证未查到数据，所以，此时输入框中即使有数据，也会报错提示请输入内容。下拉框（el-select）、日期选择器（el-date-picker）、复选框（el-checkbox）、单选框（el-radio）验证时，trigger的值选择。对el-input输入框的验证，trigger的值选。，即当值发生变化时就进行验证。，即失去焦点时进行验证。
Element form表单验证填完信息校验仍然存在的问题
weixin_49847397的博客
10-07 2913
el-date-picker v-model="formInline.applyDate" type="date" placeholder="选择日期" >今天在使用element表单验证的时候，在填入必填信息之后，必填提示仍然存在，然后通过搜索得到答案。原因：表单域的item项的prop值要与绑定的v-model值相同如下。以上为修改之后的效果。
针对elementUI input框验证非空或者必填项问题（输入之后还在报错）
热门推荐
小白在成长的路上
11-12 1万+
看了好几篇博客，啰里啰唆的不简明 我就整理一下，方便节省大家时间 首先表单验证是用到 rules属性 （需要在data中定义或者单个的话直接写在后面就行） 我这里是在data中定义了一个formRule数组 ，因为我需要验证多个input 这是定义的formRule数组，一定要注意formRule中的属性名字跟update_data中的属性名字一致，不然就会出现input输入之后还报错的现象 附加提示一下 required 是否必填 trigg...
表单校验：vue表单校验提示输入内容提示、提示信息未消失
weixin_47659945的博客
06-27 2446
由于vue2 中监听不到对象属性值变化导致子组件没有收到 formLabel 对象属性；问题出现场景： vue 项目主子组件绑定的form对象为父组件传入的对象;子组件没有同步到父组件对应的对象值导致的；将formRules 对象里面对应的key修改与formLabel 对象的key一致就行；日常开发小问题随笔记录，方便后续遇到查阅。
element ui里面 input 如果是必填，显示星号的代码
最新发布
07-15
在Element UI中，可以通过设置`prop`和`rules`属性来实现框的必填项显示星号的效果。以下是示例代码： ```html <template> <el-form :model="form" :rules="rules"> <el-form-item label="输入框" prop="input"> <el-input v-model="form.input"></el-input> </el-form-item> <el-form-item> <el-button type="primary" @click="submitForm">提交</el-button> </el-form-item> </el-form> </template> <script> export default { data() { return { form: { input: '' }, rules: { input: [ { required: true, message: '请输入内容', trigger: 'blur' } ] } }; }, methods: { submitForm() { this.$refs.form.validate((valid) => { if (valid) { // 表单验证通过，进行提交操作 // ... } else { // 表单验证未通过，进行错误提示 return false; } }); } } }; </script> ``` 在上述代码中，我们通过在`rules`属性中设置`required: true`来表示该输入框为必填项，并且通过`message`属性设置错误提示信息。当输入框为空并且触发了`blur`事件时，会显示错误提示信息。同时，在`el-form-item`标签中设置了`label`属性，该属性用来显示输入框的标签文本。如果需要显示星号，可以在`label`属性后面加上星号。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值