iview校验表单----必填选项失败

最新推荐文章于 2024-09-14 15:09:44 发布
最新推荐文章于 2024-09-14 15:09:44 发布
阅读量4.5k 收藏
点赞数 2
CC 4.0 BY-SA版权
分类专栏： iview 文章标签： iview 表单验证失效
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_40542728/article/details/89489197
本文分享了在使用iView框架进行表单验证时遇到的问题及解决方案，包括如何正确设置数据类型以通过验证，以及解决上传图片URL保存后的校验失败问题。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

1.问题：设置的是必填，明明有数据却总是显示校验错误。

原因：用iview自带的表单验证时，一直验证不通过，因为iview默认校验数据类型为String，而的表单是其他数据类型所以一直验证不通过。

解决：添加校验的对应数据类型即可。如我的数据类型是数组则设置为 type:'array'（数组类型）

其他的有：type:'number' （数字类型）     type: 'data'（日期类型）

2.input用于保存上传图片的url，上传图片保存URL还是校验失败

解决：再次校验表单字段即可

 

iview 的 时间date-picker 为 datetimerange 和Select为value=“ “ 的验证问题
qq_33164351的博客
08-10 627
1.iview的 Select下拉框的时候,数据验证必填,选择了数据,却一直提示验证不能通过 <Form :model="formData" ref="formValidate" :rules="ruleValidate" <FormItem label="请选择类型" prop="depttype" label-position="top"> <Select v-model="formData.depttype" value="formData.depttype"&g
vue的form表单切换时禁用自动验证
weixin_44975002的博客
09-10 3797
主要是在el-form中添加 :validate-on-rule-change=“false” 在 自定义的验证规则里边的 trigger里添加 trigger:[‘blur’,‘change’] userrules是验证规则 userrules: { phone: [{ required: true, message: ‘请输入用户名’, trigger:[‘blur’,‘change’] },], password: [{ required: true, message: ‘请输入密码’, trigg
vue2.0 + iview 表单验证明明有值却提示错误
weixin_34146805的博客
05-31 3203
明明有值却总是提示为空 我的解决方法时将number转为字符串 验证方法如图：（验证只可以输入数字） 赋值时转为字符串： 转载于:https://www.cnblogs.com/xll-qg/p/9117777.html...
iview的InputNumber组件有值的情况下校验失败
weixin_45016440的博客
09-14 572
iveiw表单在使用InputNumber组件的时候设置必填校验，输入框中有值却提示校验失败。这时候，我们可以在rules规则中添加类型属性type，即可正确触发校验。
iview表单校验，输入框有值校验失败
weixin_39818813的博客
11-30 3392
问题 当做表单校验时，输入框回显了后端返回的值，但是点击确认按钮时，却校验失败，提示当前项不能为空。 分析： 由于后端返回的是number类型，而其前端却使用的是普通输入框，所以导致类型不匹配。普通输入框即使我们输入的是数字，打印出来的值也会是字符串，这就说明了，普通输入框不可能会输出数字，但是回显是又是数字，好了，类型不匹配，验证自然不通过。 解决 让类似保持一致，可以把普通输入框改成数字输入框，并确保后台返回的类似也是数字。 也可以继续使用普通输入框，然后在获取后台对应的值的时候，将number转换为
iview inputNumber 输入框有值但是校验失败
weixin_39818813的博客
12-09 3002
表单校验的时候，输入输入的数字，但是表格依然校验失败。原因：校验的时候，是先执行校验的回调函数，再执行修改赋值。 可以通过打印验证是否是这种情况： 很明显，获取修改后值的方法111111打印在后，校验逻辑2222打印在前。 <template> <Form ref="form" inline :model="form" :label-width="120" :rules="rules"> <FormItem label="汇款金额" prop="money
iview的表单，单选radio嵌套选择器select时，选中某个单选项，单选嵌套的选择器需要做必填校验怎么写
最新发布
07-15
我们有一个需求：在iView表单中，当单选按钮（Radio）被选中时，对其内部嵌套的选择器（Select）进行必填校验。 思路： 1. 使用iView的Form组件进行表单校验，需要设置相应的校验规则。 2. 表单结构：一个...
form-create：跨UI框架的动态表单生成器
8. 表单操作和配置：form-create提供了丰富的API和配置选项，允许开发者对表单进行详细的配置和控制。这包括对表单字段的编辑、表单行为的定义、表单逻辑的实现等。 9. 开发和维护状态：form-create项目仍在开发和...
vue 校验多个input框右侧提示
10-18
VueValidate是一个专门为Vue设计的表单验证插件，它允许开发者轻松地实现对多个input框的同步校验，并在输入框右侧实时显示提示信息。 在Vue中，我们通常会为每个input绑定一个v-model指令，用来同步用户的输入数据...
vue表单提交数组_VUE做出带有数据收集、校验和提交功能表单
weixin_39712865的博客
12-21 1440
这次给大家带来VUE做出带有数据收集、校验和提交功能表单，VUE做出带有数据收集、校验和提交功能表单的注意事项有哪些，下面就是实战案例，一起来看一下。示例https://raw.githubusercontent.com/xaboy/form-create/dev/images/sample110.jpg安装npm install form-createORgit clone https://gi...
Vue iview form表单验证失效
qq_45094682的博客
09-20 3225
当Form表单添加rules格式校验时，我们一般会采取默认iview form表单校验，这导致一些数字类型(number)的数据验证失效
iview 表单日期有值校验失败
weixin_39818813的博客
07-28 774
表单校验失败可能情况 1. 双向绑定使用的是:value 解决：将:value改成v-model <!-- 通关期限 --> <FormItem label="企业通关期限" prop="tannetCompanyDTO.copEndDate"> <DatePicker type="date" format="yyyy-MM-dd" //:value="form.tannetCompanyDTO.cop
小程序自定义弹出框中使用iview Weapp中的数字输入框组件InputNumber输入无效问题
小怪獸丶的糖的专栏
11-09 1644
项目场景： 小程序出库功能，选择出库食材，输入出库金额。点击确定将该食材的信息以及出库数量进行存储。默认的出库数量显示当前所有的库存数量。数字输入采用ivew Weapp中的InputNumber组件 问题描述： 在微信开发者工具中进行调试，直接在input框中输入出库数量，然后点击确认。没有任何问题，真机上面调试直接输入一个出库数量，点击确定得到的出库数量依然是之前默认的当前的库存数量。手动输入的数字没有任何效果。 原因分析： 因为InputNumber绑定的事件是失去焦点以后，将这个值传递出来。所
iview form表单中input有值，但是表单校验失败，原来是Form-item里:value.sync这样绑定input不行！！！
qq_21138747的博客
08-10 1993
<i-form ref="formInline" :model="formInline" :rules="ruleInline" :label-width="80"> <div class="logo"> <img src="../static/images/logo.png" alt=""> </div> <Form-item prop
iview InputNumber 数字输入框完整校验（多个小数点问题）
ZoeLinJF的博客
09-02 5043
<InputNumber v-model.number="iptNum" @on-blur="iptBlur" @on-change="iptChange" /> 此时，输入框输入多少点，都会显示。但是v-model却只是数字 解决方法： 添加keyup监听，匹配value this.$nextTick(() => { document.getElemen...
iview表单验证问题 Select验证必填失败,以及表单对象嵌套数组验证方法
weixin_33994429的博客
07-12 4903
iview的 Select下拉框的时候,数据验证必填,明明选择了数据,却一直提示验证不能通过 1, 问题显示如下图 html代码 <Form ref="FormData" :model="FormData" :rules="ruleValidate" :label-width="100"> <FormItem label="客户分类：" prop="typeId"&...
iview 表单 验证
活在当下
03-30 2113
iView表单组件使用async-validator验证器对表单域中数据进行验证，给 Form 设置属性 rules，同时给需要验证的 FormItem 设置属性 prop 指向对应字段即可。 完整的验证规则请参照开源项目 async-validator。 验证方法也支持 Promise。 当我们对表单中某个string类型的域设置为必填时，我们可以使用如下规则 {type: 'string' ,required:true,message:'不能为空'} 但是如果我们直接输入空格也会通过验证 如何
挖坑指南：iView表单 日期校验出错
weixin_39015132的博客
11-02 5146
前言 表单数据的验证在前端是很有必要的，它是数据的第一道过滤。可以避免一些错误的发生 开始 先看看我们的使用 虽然iView的官方已经更新到3.0的版本了，但是目前项目中使用的还是2.0的版本。 官方的文档：http://v2.iviewui.com/components/form 实践 对照看了官方的文档，使用方式是相同的，字段也是没有问题滴。校验为啥就会报错呢？仔细地对照...
iview input框校验number类型总是提示错误
cainiao1412的博客
10-11 2790
首先Input框添加一个 number 属性 <Input placeholder="请输入项目单价" number v-model="dataObj.projectPrice"></Input> 随后 ruleValidate 中 ，在非空校验中添加一个 type: ‘number’ projectPrice: [ { required: true, type: 'number', message: '请输入项目单价', trigger: 'blur'
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值