Vue的UI解决框架,element-UI, iview-UI 有关表单验证使用的是同一个插件,async-validator,有关这个插件的用法就不做赘述,但是在iview表单的使用中可能会用到验证不起作用的问题,原因是给表单绑定的value是id或者type,value等Number类型的值,多见于select下拉框,这时,由于async-validator默认只验证String类型的,所以才导致的验证不起作用的问题,解决方案:async-validator支持正则验证,加上正则后自动将要验证的字段值转为String类型

id: [

  {required: true, message: '请选择', pattern: /.+/, trigger: 'change'}

]

可以看到,加红部分,是一个正则表达式,匹配所有非空值

有关使用 iview 表单验证的问题的更多相关文章

  1. iview表单验证下拉框不通过问题

    iview表单验证的步骤: 第一步:给 Form 设置属性 rules :rules 第二步:同时给需要验证的每个 FormItem 设置属性 prop 指向对应字段即可 prop=”“ 第三步:注意 ...

  2. iview表单验证不生效问题注意点

    按照iview官网介绍写的form表单验证,但是无论填写与否都不进行校验,找了很久的原因,突然才发现一个关键的地方,一定要加props!!! https://blog.csdn.net/xuaner8 ...

  3. iview表单验证之正则验证、函数验证

    iview表单验证之正则 正则验证: 代码: loginRules: { stringLength: [ { required: true, message: '该字段不能为空', trigger: ...

  4. iview 表单验证不通过问题?

    项目需要,需要怂iview..使用一段时间感觉跟elementUI用起来差不多很方便.使用过程中遇到表单验证问题,如何避免在验证过程中偶尔出现验证不通过的异常情况? <1>:给 <F ...

  5. vue中使用iview表单验证时this指针问题

    需求 使用iview,在提交时对值b进行验证,使其不能大于值a 实现 <Form ref="config" :model="config" :rules= ...

  6. iview 表单验证

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  7. iview表单验证trigger:'change,blur'

    今天发现,如果设置select的trigger:'blur'就算选择之后还是边框是红色的,之后查了一下iview的文档,也没有找到准确的蚊子描述,只看到form那个组件其中有一个例子,大概是selec ...

  8. iview表单验证数字

    验证输入字符串必须为数字 html: <FormItem label="兑换积分:" prop="exchangeIntegral"> <In ...

  9. iview表单验证--数字必填+校验

    直接使用: { required: true, type:"integer", message:"请填写整数", trigger: "blur&quo ...

随机推荐

  1. 使用NHibernate(2)-- 让程序跑起来

    1, 创建一个MVC的程序,NHibernateDemo,并用NuGet安装NHibernate. 安装引用后,NuGet会自动安装NHibernate所依赖的类库 Iesi.Collections  ...

  2. 快速创建SpringBoot+SSM解析

    此处使用IDEA快速搭建SpringBoot应用,首先用SpringBoot搭建WEB工程: 然后点击Next生成项目,首次生成可能有点慢,下次创建的时候就会快很多,生成后的目录结构如下: 我们更改下 ...

  3. linux安装使用xdebug

    我还是来给大家一个正确的配方,每个人的php版本不一样 所以下载的xdebug应该是不一样的 1,https://xdebug.org/wizard.php   进入这个网页 把自己phpinfo的信 ...

  4. JVM-ClassLoader类加载器

    类加载器: 对于虚拟机的角度来看,只存在两种类加载器: 启动类加载器(Brootstrap ClassLoader)和“其他类加载器”.启动类加载器是由C++写的,属于虚拟机的一部分,其他类加载器都是 ...

  5. django notes 六:数据库 CRUD 操作

    CRUD 也没什么可说的,django 提供了完善的 orm  api, 直接用就行了. 我只贴几个列子,一看就明白了,自己再用用就熟了. # create b = Blog(name='Beatle ...

  6. Check类之TypeValidation

    (1)Validator类的visitTypeApply()方法 实例1: class TestTypeVal<T extends InputStream>{ TestTypeVal< ...

  7. python-cgi-demo

    简单的Python CGI 在linux平台实现注意:路径是以当前路径为根目录 ,Python文件一般放在/cgi-bin/目录下在linux命令行运行:python  -m  CGIHTTPServ ...

  8. HDFS Java Client对hdfs文件增删查改

      step1:增加依赖 pom.xml           ...      <!-- https://mvnrepository.com/artifact/org.apache.hadoop ...

  9. Delphi下OpenGL2d绘图(06)-画图(多窗口、多视图、多个DC)

    一.前言 在学习OpenGL的过程中,发现很多函数都是全局的.前面几章中都是在一个窗口DC中画图,那么要在多个窗口画图,需要怎么处理呢?网上方法有多种,这里采用其中一种,利用wglMakeCurren ...

  10. [转]bootstrap-datetimepicker 火狐浏览器报错

    本文转自:https://segmentfault.com/a/1190000008457568 使用bootstrap-datetimepicker日期选择插件时发现在火狐浏览器下报错: 未压缩版报 ...