问题:如果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. 关于EF中出现FOREIGNKEY约束可能会导致循环或多重级联路径的问题

    ef中,我们创建外键的时候需要注意,否则会出现标题所示问题. 例:有项目表,项目收藏表,用户表 项目表有如下字段:ProjectId,InputPersonId等 项目收藏表有如下字段:Project ...

  2. 从零开始学安全(二十三)●用PHP编写留言板

    <?php include("test.php"); ?> <!DOCTYPE html> <html> <head> <me ...

  3. 第一讲 从头开始做一个web qq 机器人,第一步获取smart qq二维码

    新手教程: 前言:最近在看了一下很久很久以前做的qq机器人失效了,最近也在换工作目前还在职,时间很挺宽裕的.就决定从新搞一个web qq机器人 PC的协议解析出来有点费时间以后再做. 准备工作: 编译 ...

  4. Newtonsoft.Json(Json.net) 的使用

    Newtonsoft.Json(Json.net) 的使用 //Newtonsoft.Json.dll using Newtonsoft.Json; using Newtonsoft.Json.Con ...

  5. word转PDF,PDF转Image,使用oppenOffice注意事项等

    最近在电子合同等项目中需要把word或者pdf转换成image,用到了openOffice把word转换pdf,以及把pdf转换成图片 感谢小伙伴张国清花费了三天时间来实现了此功能.下面我将把具体的步 ...

  6. es6 语法 (Decorator)

    修饰器是一个函数,用来修改类的行为(注意:1.函数  2.修改行为  3.对类进行操作) { //修饰器函数定义 target:类本身,name名称,descriptor描述 let readonly ...

  7. HTML DOM classList 属性

    页面DOM里的每个节点上都有一个classList对象,程序员可以使用里面的方法新增.删除.修改节点上的CSS类.使用classList,程序员还可以用它来判断某个节点是否被赋予了某个CSS类. 添加 ...

  8. BZOJ4559: [JLoi2016]成绩比较(dp 拉格朗日插值)

    题意 题目链接 Sol 想不到想不到.. 首先在不考虑每个人的真是成绩的情况下,设\(f[i][j]\)表示考虑了前\(i\)个人,有\(j\)个人被碾压的方案数 转移方程:\[f[i][j] = \ ...

  9. Loadrunner 脚本优化-事务函数简介

    脚本优化-事务函数简介 by:授客 QQ:1033553122 1.事务的开始和结束名称需要相同 lr_start_transaction(“transaction_name”); …//事务处理 l ...

  10. 嵌套RecyclerView左右滑动替代自定义view

    以前的左右滑动效果采用自定义scrollview或者linearlayout来实现,recyclerview可以很好的做这个功能,一般的需求就是要么一个独立的左右滑动效果,要么在一个列表里的中间部分一 ...