添加和修改公用一个弹窗,点击添加弹窗后,如果没移除表单校验的话,再点击修改弹窗时校验就会被记住,所以需要移除校验,但在清空表单校验时会报如下错误:

那么,你只需要加上这段话即可

this.$nextTick(()=>{
this.$refs.addArray.resetFields();
})
再此,我顺便说一下resetFields和clearValidate的区别:

this.$refs.form.resetFields(); //移除表单校验并初始化表单,一般用于添加

this.$refs.form.clearValidate(); //移除表单校验,一般用于修改

注:nextTick(),是将回调函数延迟在下一次dom更新数据后调用,简单的理解是:当数据更新了,在dom中渲染后,自动执行该函数

Element-Ui表单移除校验clearValidate和resetFields的更多相关文章

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

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

  2. vue开源Element UI表单设计及代码生成器

    在日常的开发工作中,表单开发是较为繁琐且重复的.本文介绍一个我自己写的,提高开发效率的小工具. 1 可视化设计器 设计器基于Element UI ,可通过点击或拖拽的方式设计基本表单, 设计器生成的代 ...

  3. (vue.js)element ui 表单重置

    el-form需要接收一个model,并且需要配合el-form-item一起使用,并且在el-form-item上绑定prop属性,resetField方法才能好使. <el-form :mo ...

  4. vue踩坑:vue+ element ui 表单验证有值但验证失败。

    一.如图:有值但是验证失败 二. <el-form :model="form" :rules="rules"> <el-form-item l ...

  5. Element Form表单实践(上)

    作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...

  6. Element Form表单实践(下)

    作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...

  7. UI表单

    Monk.UI表单美化插件诞生记!   阅读目录 背景 预览效果 表单组件 普通文本框 多行文本框 复选框 切换滑块 单选框 下拉选择框 数字输入框 时间选择 文件选择 显示文本 按钮 开源地址 背景 ...

  8. Rails-Treasure chest1 (自定义Model网址;多语言包; 时区设置, TimeZone类; 格式日期时间; 表单单选UI; 表单多选UI;Select2 Plugin)

    自定义Model网址: 随机值网址SecureRandom.base58 多语言包, 包括默认语言设置和user自设置. 时区设置, TimeZone类 ,增加user自选时区功能 格式日期时间: x ...

  9. JavaWeb -- Struts2,对比, 简单表单提交,校验,防重复提交, 文件上传

    Struts2核心流程图 1. Struts2 和 Struts1 对比 struts1:基于Servlet(ActionServlet),actionForm众多(类的爆炸),action单例(数据 ...

  10. vue+element 动态表单验证

    公司最近的项目有个添加动态表单的需求,总结一下我在表单验证上遇到的一些坑. 如图是功能的需求,这个功能挺好实现的,但是表单验证真是耗费了我一些功夫. vue+element在表单验证上有一些限制,必须 ...

随机推荐

  1. Function源码解析与实践

    作者:陈昌浩 1 导读 if-else-在代码中经常使用,听说可以通过Java 8的Function接口来消灭if-else-!Function接口是什么?如果通过Function接口接口消灭if-e ...

  2. day28 BOM浏览器对象 & 定时事件与Cookie & (视频卷子讲解)

    3.10 BOM浏览器对象模型 3.10.1 window对象 所有浏览器都支持window对象,它表示浏览器窗口: | 属性 | history 网页历史记录 返回History只读对象 locat ...

  3. Idea中Git的常用操作及可能存在的问题

    一.使用 1.从git上下载项目 (1)默认branch下载(pull) (2)指定branch下载 (3)克隆远程仓库到本地(git clone) git clone https://github. ...

  4. MyBatis03:连接池及事务控制、xml动态SQL语句、多表操作

    今日内容: mybatis中的连接池.事务控制[原理了解,应用会用] mybatis中连接池的使用及分析 mybatis中事务控制的分析 mybatis中基于xml配置的动态SQL语句使用[会用即可] ...

  5. 用最少的代码打造一个Mini版的gRPC框架

    在<用最少的代码模拟gRPC四种消息交换模式>中,我使用很简单的代码模拟了gRPC四种消息交换模式(Unary.Client Streaming.Server Streaming和Dupl ...

  6. 云原生 • Kubernetes 认识 k8s、k8s 架构、核心概念点介绍

    云原生 • Kubernetes 认识 k8s.k8s 架构.核心概念点介绍 一.Kubernetes 简介Kubernetes 简称 k8s,是支持云原生部署的一个平台,起源于谷歌.谷歌早在十几年之 ...

  7. 【vue3】element-plus,Checkbox-Group多选框之绑定选中数据不选中问题

    今天记录一下在新项目vue3中,使用的element-plus组价库遇到的一个问题!场景如下:有一个表格的column绑定的数组对象,我需要对表格的头部实现动态可配置显示表格列,由于绑定的column ...

  8. JavaScript入门⑩-ES6归纳总结

    JavaScript入门系列目录 JavaScript入门①-基础知识筑基 JavaScript入门②-函数(1)基础{浅出} JavaScript入门③-函数(2)原理{深入}执行上下文 JavaS ...

  9. ModuleNotFoundError: No module named 'MySQLdb'

    执行命令 python manage.py makemigrations时抛出以下错误 Traceback (most recent call last): File "D:\Program ...

  10. java Jdbc 简单方法

    1.注册驱动(第一种方法) Class.forName(com.mysql.jdbc.Driver"); 2.获得连接DriverManager.getConnection(url,user ...