问题:如果vue的同一个页面拥有两个表单。验证第一个表单时没有通过就切换到第二个,那么第二个表单会出现验证错误的信息

我们可以通过为两个表单添加ref属性

之后在通过调用resetFields()方法来解决问题

代码如下

<el-form :model="form" :rules="rules" ref="form" label-width="100px">
this.$refs["form"].resetFields();

vue同一页面中拥有两个表单时,验证问题的更多相关文章

  1. [.NET Core]ASP.NET Core中如何解决接收表单时的不支持的媒体类型(HTTP 415 Unsupported Media Type)错误呢?

    [.NET Core]ASP.NET Core中如何解决接收表单时的不支持的媒体类型(HTTP 415 Unsupported Media Type)错误呢? 在ASP.NET Core应用程序中,接 ...

  2. jquery中使用serialize() 序列化表单时 中文乱码问题

    序列化中文时之所以乱码是因为.serialize()调用了encodeURLComponent方法将数据编码了 解决方法就是进行解码 1 原因:.serialize()自动调用了encodeURICo ...

  3. html5中新增的form表单属性

    html5中新增两个表单属性,分别autocomplete和novalidate属性 1.autocomplete属性 该属性用于控制自动完成功能的开启和关闭.可以设置表单或者input元素,有两个属 ...

  4. ThinkPHP表单令牌验证功能详细介绍

    注:TP版本为3.1.3 在ThinkPHP框架下,两次提交同一个表单,比如提交信息后在浏览器点击后退退回上次的页面,重新点击提交按钮,就会提示“表单令牌错误”的信息. ThinkPHP新版内置了表单 ...

  5. [K/3Cloud]调用动态表单时,传递自定义参数

    插件中在调用动态表单时,通过DynamicFormShowParameter的CustomParams,增加自定义的参数. private void ShowMaterialStock() { obj ...

  6. javaWeb中一个按钮提交两个表单

    一个按钮提交两个表单,有时候会用到,一般会很容易想到使用 onclick="document.form1.submit();document.form2.submit();" 的方 ...

  7. 在页面中添加两个 <select> 标签,用来显示年份和月份;同时添加两个 <ul> 标签,一个用来显示星期,另一个用来显示日期 在 JavaScript 脚本中动态添加年份和月份,获取当前日期的年份

    查看本章节 查看作业目录 需求说明: 使用 JavaScript 中的 Date 对象,在页面上显示一个万年历.选择不同的年份和月份,在页面中显示当前月的日历 实现思路: 在页面中添加两个 <s ...

  8. aspx中的表单验证 jquery.validate.js 的使用 以及 jquery.validate相关扩展验证(Jquery表单提交验证插件)

    这一期我们先讲在aspx中使用 jquery.validate插件进行表单的验证, 关于MVC中使用 validate我们在下一期中再讲     上面是效果,下面来说使用步骤 jQuery.Valid ...

  9. 页面注册系统--使用forms表单结合ajax

    页面注册系统--使用forms表单结合ajax 在Django中通过forms构建一个表单 1.urls.py 配置路由 from django.conf.urls import url from d ...

随机推荐

  1. Spring Day 1

    概述 开发三层架构,web层 service服务层,dao持久层. web层struts2配置核心过滤器/*,通过拦截器调用目标action,action中调用service层开启事务. servic ...

  2. 开源的api文档管理系统

    api文档 php 在项目中,需要协同开发,所以会写许多API文档给其他同事,以前都是写一个简单的TXT文本或Word文档,口口相传,这种方式比较老土了,所以,需要有个api管理系统专门来管理这些ap ...

  3. Java并发编程-CountDownLatch

    基于AQS的前世今生,来学习并发工具类CountDownLatch.本文将从CountDownLatch的应用场景.源码原理解析来学习这个并发工具类. 1. 应用场景 CountDownLatch是并 ...

  4. CSS table-layout 属性

    设置表格布局算法: table { table-layout:fixed; } 所有浏览器都支持 table-layout 属性. 定义 tableLayout 属性用来显示表格单元格.行.列的算法规 ...

  5. 协程与Epoll的配合

    想快速了解协程与网络调用的原来么,那么请赶紧关闭本页,因为下面都是在扯淡. 这几天是端午假期,第一天大算照着网上一大堆基于ucontext来写协程的文章自己也写一个简单的协程实现.于是第一天我就开始动 ...

  6. memcached 源码阅览 一

    想要快速了解memcached内部原理么?那么赶紧离开本页,这会耽误您的时间. 不知时隔多少时间,今天受了些刺激,在码农路上开始犹豫起来,但是想想自己也没其他本身,就只好放下王者荣耀,重新看看技术内容 ...

  7. 前端入门3-CSS基础

    本篇文章已授权微信公众号 dasu_Android(大苏)独家发布 声明 本系列文章内容全部梳理自以下四个来源: <HTML5权威指南> <JavaScript权威指南> MD ...

  8. K8S 容器的资源需求、资源限制

    容器的资源需求,资源限制 requests:需求,最低保障: limits:限制,硬限制: CPU: 1 颗逻辑 CPU 1=1000,millicores 500m=0.5CPU QoS: Gura ...

  9. 【机器学习基本理论】详解最大后验概率估计(MAP)的理解

    [机器学习基本理论]详解最大后验概率估计(MAP)的理解 https://blog.csdn.net/weixin_42137700/article/details/81628065 最大似然估计(M ...

  10. ASP.NET MVC Json的序列化和反序列化

    1.利用js进行序列化成字符串和反序列化 var personObj = {name:"Tom",age:16}; // 利用JS序列化成字符串 var personStr = J ...