1 form 添加rules,具体属性添加prop, 注意 prop 属性与v-model 子属性一致

2 data 对象添加 rules

3 验证方法调用

验证规则见：

https://github.com/yiminghe/async-validator

碰到的坑

1

1 如果用到嵌套的rules属性
 

2 prop与v-model属性需要一致，如过不一致，验证不起作用

element UI form 验证的更多相关文章

  1. shit element ui & form password validation

    shit element ui & form password validation shit docs https://github.com/yiminghe/async-validator ...

  2. Element UI Form 每行显示多列，即多个 el-form-item

    Element UI Form组件使用问题. 每个 el-form-item 都会独占一行. 对于输入项很多的管理app, 能否在每个form中, 每行显示 2 个或者多个 el-form-item ...

  3. element ui form表单清空规则

    公司项目重构,经过商定使用element ui.在重构项目的时候发现一下element ui上很蛋疼的东西. 例如,这个form表单就是一个.趁着在高铁上没事,把想写的东西写一下. 先说一下eleme ...

  4. element ui 登录验证，路由守卫

    <template> <!-- el-form :label-position="labelPosition" 设置label的位置 :model 用来给表单设置 ...

  5. element ui FORM表单

    form表单 Form-Item Slot [label] 旧版语法 <el-form-item label="活动名称" prop="name"> ...

  6. 使用饿了么ui表单验证报错: [Element Warn][Form]model is required for validat

    [Element Warn][Form]model is required for validat 如文末的完整例子: 该提示说的是 form表单需要一个绑定一个 对象(使用:model=" ...

  7. 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题

        方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...

  8. Element Ui使用技巧——Form表单的校验规则rules详细说明

    Element UI中对Form表单验证的使用介绍: Form 组件提供了表单验证的功能,只需要通过 rules 属性传入约定的验证规则,并将 Form-Item的 prop 属性设置为需校验的字段名 ...

  9. element ui组件的开始时间-结束时间验证

    <el-date-picker v-model="seach.before" type="date" placeholder="开始时间&quo ...

随机推荐

  1. Cannot read property 'protocol' of undefined的原因和解决办法

    Cannot read property 'protocol' of undefined 原因:axios请求中的错误 1.请求地址写错了 2.没有引入http.js 3.引入http.js的时候,单 ...

  2. C# 结构（struct）的特点

    1.C# 中的结构有以下特点: 结构可带有方法.字段.索引.属性.运算符方法和事件. 结构可定义构造函数,但不能定义析构函数.但是,您不能为结构定义默认的构造函数.默认的构造函数是自动定义的,且不能被 ...

  3. Mysql通过sql语句添加约束和查看约束

    一:添加约束 1.添加唯一约束:alter table student add constraint uk_name unique(name); 2.添加外键约束: alter table 表名 ad ...

  4. How to transfer developer profile to one mac to another mac

    Export developer profile from old mac. In the Xcode Organizer, select your team in the Teams section ...

  5. java基础-day24

    第01天 java基础加强 今日内容介绍 u Junit单元测试及反射概述 u 反射操作构造方法.成员方法.成员属性 u properties的基本操作 u 综合案例 第1章   Junit单元测试及 ...

  6. redis简单使用

    主要参考资料:http://wiki.jikexueyuan.com/project/redis-guide/data-type.html一.redis 安装1.在官网下载安装包2.解压安装包 tar ...

  7. 第85讲：Scala中For表达式的强大表现力实战

    今天来学一下scala中的For表达式的用法. package scala.learn case class Persons(name:String,isMale:Boolean,children:P ...

  8. QT源码查看001-QApplication和QCoreApplication

    QCoreApplication和QApplication的区别(1) QApplication这个类是继承QCoreApplication的,而QCoreApplication有继承QObject的 ...

  9. CSS 基础 例子 行高line-height

    “行高“指一行文字的高度,具体来说是指两行文子间基线间的距离.在CSS,line-height被用来控制行与行之间的垂直距离.line-height 属性会影响行框的布局.在应用到一个块级元素时,它定 ...

  10. I - Dividing Stones

    Description There are N stones, which can be divided into some piles arbitrarily. Let the value of e ...