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. start and end call use itelephony and how to pick up a call

    Bluetooth Headset service: 但想想而已. 没有蓝牙耳机如何调用它来接听电话.想想有点搞笑. 网上扒的通过添加一个ITelephony.aidl来反射,注意aidl的写法,如果 ...

  2. 小程序中实时将less编译成wxss

    1.npm或者yarn全局安装wxss-cli npm install -g wxss-cli 2.运行wxss-cli命令(weuiTest为小程序目录) wxss ./weuiTest 实时监听w ...

  3. MySql互为主从配置文件及配置方法

    # Example MySQL config file for medium systems. # # This is for a system with little memory (32M - 6 ...

  4. oracle创建表空间个用户四部曲

    /*分为四步 *//*第1步:创建临时表空间  */create temporary tablespace user_temp  tempfile 'D:\oracle\oradata\Oracle9 ...

  5. WCF系列教程之客户端异步调用服务

    本文参考自http://www.cnblogs.com/wangweimutou/p/4409227.html,纯属读书笔记,加深记忆 一.简介 在前面的随笔中,详细的介绍了WCF客户端服务的调用方法 ...

  6. 微服务Kong（二）——快速入门

    在本节中,您将学习如何管理您的KONG实例.首先,我们将指导您如何启动Kong,以便您能访问KONG的RESTful形式的管理界面,您可以通过它来管理您的API,consumers等.通过管理型API ...

  7. 深度学习（十六） ReLU为什么比Sigmoid效果好

    sigmoid: Relu: 为什么通常Relu比sigmoid和tanh强,有什么不同?主要是因为它们gradient特性不同. 1.sigmoid和tanh的gradient在饱和区域非常平缓,接 ...

  8. 枚举类型与Switch

    1.枚举类型,就是一个集合,集合内所有的元素都是枚举类型的, 主要是应用在可预计的集合中,(你知道它的值就只有那么几种情况,这时就可以使用枚举类型) 如: //结果一般只有两种,成功与失败 publi ...

  9. [作业] Python入门基础--猜年龄

    age = 20 while True: try: guess_age = int(input('guess age:')) if guess_age > age: print('Is bigg ...

  10. 《Think Python》第15章学习笔记

    目录 <Think Python>第15章学习笔记 15.1 程序员定义的类型(Programmer-defined types) 15.2 属性(Attributes) 15.3 矩形( ...