使用element-ui自带的表单校验,注意几个点:

1.el-form通过rules属性,绑定校验规则

2.el-form-item的prop属性,设置为需要校验的字段名

3.提交后二次校验

            saveEdit(formName) {
this.$refs[formName].validate((valid) =>{
if (valid){
this.editVisible = false
} else{
this.$alert('有必填项未输入,请检查')
}
})
}

element-ui文档:http://element-cn.eleme.io/#/zh-CN/component/form

element-ui Form表单校验的更多相关文章

  1. element ui form表单清空规则

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

  2. element ui FORM表单

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

  3. 应用二:Vue之ElementUI Form表单校验

    (注:本文适用于有一定Vue基础或开发经验的读者,文章就知识点的讲解不一定全面,但却是开发过程中很实用的)   表单校验是前端开发过程中最常用到的功能之一,根据个人的工作经验总结在此对表单校验功能的基 ...

  4. iview form表单数值类型校验「iview自定义form表单校验器」

    摘录iview表单验证 Form 组件基于 sync-validator 实现的数据验证,给 Form 设置属性 rules,同时给需要验证的 FormItem 设置属性 prop 指向对应字段即可. ...

  5. vue+iview的form表单校验总结

    这篇文章时关于如何使用iview的form表单校验.主要学习如何使用form校验(以校验文字长度为例),以及如何动态添加校验规则和异步校验. 1.为需要校验的表单添加form标签 <!--注意: ...

  6. React-Antd4的Form表单校验

    之前很少用react做项目,最近入职新公司,用的react,在自己的摸索过程中,慢慢会记录一些使用方法.今天简单记录一下使用antd 4.0版本的Form表单校验,直接代码. 需要购买阿里云产品和服务 ...

  7. vue自定义轻量级form表单校验

    遇到了form表单提交的需求,找了vue的组件觉得不够灵活,有时间自己写了一个. 调用方法 全局引入注册: import va from 'global/js/va' va.install(Vue); ...

  8. 封装Vue Element的form表单组件

    前两天封装了一个基于vue和Element的table表格组件,阅读的人还是很多的,看来大家都是很认同组件化.高复用这种开发模式的,毕竟开发效率高,代码优雅,逼格高嘛.虽然这两天我的心情很糟糕,就像& ...

  9. vue+element ui 重置表单

    <el-dialog :title="addForm.title" :visible.sync="dialogFormVisible" width=&qu ...

随机推荐

  1. 9. Web browser-related (网页浏览器相关 4个)

    Firefox NoScript是Firefox的插件,可以阻止JavaScript,Java,Flash和其他插件内容(允许您选择性地重新启用某些站点). 它还提供跨站点脚本保护. 这主要是为了保持 ...

  2. anki vector robot入门语音指令大全

    vector机器人功能不断完善. 一:刚开始支持一些基础指令,你跟他说话他能在本机识别,然后做出相应的响应.在说这部分指令之前,需要加上Hey Vector.(嘿,维课的),然后他会准备听取你的指令, ...

  3. C# 控件消失等问题

    控件消失原因: 1.新控件的触发导致页面重载,该重载有没有达到原有控件的触发状态进而消失. 2.(目前只发现这一点,后续又发现再更...) 1.示例: ASPX: <div> <!- ...

  4. 详解java定时任务---Timer篇

    一.简介      在java的jdk中提供了Timer.TimerTask两个类来做定时任务. Timer是一种定时器工具,用来在一个后台线程计划执行指定任务,而TimerTask一个抽象类,它的子 ...

  5. 线程中AutoResetEvent与ManualResetEvent的区别

    线程之间的通信是通过发信号来进行沟通的.. ManualResetEvent发送Set信后后,需要手动Reset恢复初始状态.而对于AutoResetEvent来说,当发送完毕Set信号后,会自动Re ...

  6. 基于MATLAB搭建的DDS模型

    基于MATLAB搭建的DDS模型 说明: 累加器输出ufix_16_6数据,通过cast切除小数部分,在累加的过程中,带小数进行运算最后对结果进行处理,这样提高了计算精度. 关于ROM的使用: 直接设 ...

  7. mongodb 导入文件

    linux命令:mongorestore -d db_name 文件夹目录 windows命令:mongorestore.exe -d db_name 文件夹目录

  8. HTML 块级元素 行内元素

    块级元素 - block level element 总是在新行上开始: 高度,行高以及外边距和内边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度: 它可以容纳内联元素和其他块元素 如: ...

  9. CSS的块级元素和内联元素的概念

    三生有幸,偶然之下知道了<CSS世界>这本书,让我产生了探究 CSS 的想法. 这里对 CSS 中的块级元素和内联元素的概念做一个简单的整理. 可能对于我们前端开发人员来讲,一般接触到的元 ...

  10. [UE4]Grab抓取

    一.关键函数:AttachToCompoent,将要抓取的物品附加到角色手上,让物品跟随手移动,开起来就像是抓取在手里了. 二.取消模拟物理.在开启模拟物理的情况下,AttachToCompoent是 ...