VUE+ElementUI的表单验证二选一必填项,并且满足条件后清除表单验证提示

news2024/10/6 6:39:54

image

上代码

<el-form-item label="出库单号" prop="ecode" ref="ecode" :rules="rules.ecode">
                <el-input v-model="queryParams.ecode" placeholder="出库单号和出库箱号至少填写一项" clearable style="width: 300px" />
              </el-form-item>
              <el-form-item label="出库箱号" prop="econtainerCode" ref="econtainerCode" :rules="rules.econtainerCode">
                <el-input v-model="queryParams.econtainerCode" placeholder="出库单号和出库箱号至少填写一项" clearable style="width: 300px"  />
              </el-form-item>
data() {
    var validateName = (rule, value, callback) => {
      if (!this.queryParams.ecode && !this.queryParams.econtainerCode) {
        callback(new Error("请至少填写一项"))
      } else {
        //任意值被填写,清除验证提示
        if (!this.queryParams.ecode || !this.queryParams.econtainerCode) {
          // this.$nextTick(() => {
          //   this.$refs.zhname.clearValidate()
          // })
          this.$refs.ecode.clearValidate()
          this.$refs.econtainerCode.clearValidate()
        }
        callback()
      }
    }

    return {
      rules: {
        ecode: [
          {
            required: true,
            validator: validateName,
            trigger: "change",
          },
        ],
        econtainerCode: [
          {
            required: true,
            validator: validateName,
            trigger: "change",
          },
        ],
      }}

原文来源

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/866146.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Labview控制APx(Audio Precision)进行测试测量(六)

用 LabVIEW 驱动 VIs生成任意波形 在 APx500 应用程序中&#xff0c;默认波形类型为正弦。这是指 APx 内置的正弦发生器&#xff0c;根据信号路径设置&#xff0c;许多测量还允许其他内置波形&#xff0c;如方波&#xff0c;分裂正弦波或分裂相位&#xff0c;以及使用导入的。w…

27.Netty源码之FastThreadLocal

highlight: arduino-light FastThreadLocal FastThreadLocal 的实现与 ThreadLocal 非常类似&#xff0c;Netty 为 FastThreadLocal 量身打造了 FastThreadLocalThread 和 InternalThreadLocalMap 两个重要的类。下面我们看下这两个类是如何实现的。 FastThreadLocalThread 是对…

Java-低代码平台使用H2内存数据库

一、引言 作者目前在做的平台使用到了H2&#xff0c;这里介绍下使用场景、使用方式&#xff0c;出于以下两个原因会使用H2: 1、平台化的项目一般是用户使用脚本或者sql进行通用的执行&#xff0c;这样可以实现低代码平台&#xff0c;不需要管理类之间的引入、依赖、编译&#x…

4个简化IT服务台任务的ChatGPT功能

最近几个月&#xff0c;ChatGPT 风靡全球&#xff0c;这是一个 AI 聊天机器人&#xff0c;使用户能够生成脚本、文章、锻炼图表等。这项技术在各行各业都有无穷无尽的应用&#xff0c;在本文中&#xff0c;我们将研究这种现代技术如何帮助服务台团队增强服务交付和客户体验。 什…

AD7151

AD7151采用ADI公司的电容-数字转换器&#xff08;CDC&#xff09;技术,这种技术汇集了与实际传感器接口过程中起着重要作用的众多特性于一身,如高输入灵敏度,较高的输入寄生接地电容和泄漏电流容限。 集成自适应式阈值算法可对因环境因素&#xff08;如湿度和温度&#xff09;…

AI:02-基于深度学习的动物图像检索算法的研究

文章目录 一、算法原理二、代码实现三、实验结果四、总结深度学习在计算机视觉领域中的应用越来越广泛,其中动物图像检索算法是一个重要的应用场景。本文将介绍一种基于深度学习的动物图像检索算法,并提供相应的代码实现。 一、算法原理 本算法采用卷积神经网络(Convolutio…

Attention is all you need ---Transformer

大语言模型已经在很多领域大显身手&#xff0c;其应用包括只能写作、音乐创作、知识问答、聊天、客服、广告文案、论文、新闻、小说创作、润色、会议/文章摘要等等领域。在商业上模型即产品、服务即产品、插件即产品&#xff0c;任何形态的用户可触及的都可以是产品&#xff0c…

docker实现Nginx

文章目录 1.docker 安装2.docker环境实现Nginx 1.docker 安装 1.使用环境为红帽8.1,添加源 yum-config-manager --add-repo https://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo2.安装 yum install docker-ce docker-ce-cli containerd.io显示出错 Docker C…

强化学习-信任区域策略优化和近端策略优化(第7章)

来源书籍&#xff1a; TENSORFLOW REINFORCEMENT LEARNING QUICK START GUIDE 《TensorFlow强化学习快速入门指南-使用Python动手搭建自学习的智能体》 著者&#xff1a;[美]考希克巴拉克里希南&#xff08;Kaushik Balakrishnan&#xff09; 译者&#xff1a;赵卫东 出版…

JSP的文件扩展名必须是.jsp吗

并不是 打开Tomcat目录下conf目录下的web.xml 也就是说,映射路径为xxx.jsp或者xxx.jspx就会访问jsp 可以修改

前后端分离------后端创建笔记(上)

本文章转载于【SpringBootVue】全网最简单但实用的前后端分离项目实战笔记 - 前端_大菜007的博客-CSDN博客 仅用于学习和讨论&#xff0c;如有侵权请联系 源码&#xff1a;https://gitee.com/green_vegetables/x-admin-project.git 素材&#xff1a;https://pan.baidu.com/s/…

Mysql:Access denied for user ‘root‘@‘localhost‘ (using password:YES)解决方案

最近在配置Maven以及Mybatis时&#xff0c;连接localhost数据库时出现无法连接&#xff0c;用cmd测试时报错&#xff1a;Access denied for user ‘ODBC’‘localhost’ (using password: NO)&#xff0c;这个意思就是不允许远程访问&#xff0c;一开始笔者进入mysql试了一下是…

计算机网络:网络字节序

目录 一、字节序1.字节序概念2.字节序的理解&#xff08;1&#xff09;大端模式存储数据&#xff08;2&#xff09;小端模式存储数据 二、网络字节序 一、字节序 1.字节序概念 字节序&#xff1a;内存中存储多字节数据的顺序。 难道存储数据还要看顺序吗&#xff1f; yes。内…

maven是什么?安装+配置

目录 1.什么是maven&#xff1f; 1.2.maven的核心功能是什么&#xff1f; 2.Maven安装配置 2.1Maven的安装 2.2Maven环境配置 1.配置 MAVEN_HOME &#xff0c;变量值就是你的 maven 安装的路径&#xff08;bin 目录之前一级目录&#xff09; 2.将MAVEN_HOME 添加到Path系…

路由导航守卫中document.title = to.meta.title的作用以及路由跳转修改页面title

目录 &#x1f53d; document.title to.meta.title的作用 &#x1f53d; Vue路由跳转时如何更改页面title &#x1f53d; document.title to.meta.title的作用 路由导航守卫如下&#xff1a; router.beforeEach(async (to, from, next) > {document.title to.meta.ti…

“一日之际在于晨”,欢迎莅临WAVE SUMMIT上午场:Arm 虚拟硬件早餐交流会

8月16日&#xff0c;盛夏的北京将迎来第九届WAVE SUMMIT深度学习开发者大会。在峰会主论坛正式开启前&#xff0c;让我们先用一份精美的元气早餐&#xff0c;和一场“Arm虚拟硬件交流会”&#xff0c;唤醒各位开发小伙伴的开发魂&#xff01; 8月16日&#xff0c;WAVE SUMMIT大…

湘大 XTU OJ 1097 排序 题解:c++ 函数库的使用 快速排序 归并排序 冒泡排序

一、链接 1097 排序 二、题目 Description N个整数&#xff0c;将其排序输出。 输入 第一行是一个整数K&#xff08;1<K<20&#xff09;&#xff0c;表示有多少个样例&#xff0c;每个样例的第一行是一个整数N&#xff08;1<N<1,000&#xff09;和一个字符X&…

136.只出现一次的数字+26.删除有序数组中的重复项

目录 一、136.只出现一次的数字 二、代码 三、26删除有序数组中的重复项 四、代码 一、136.只出现一次的数字 136. 只出现一次的数字 - 力扣&#xff08;LeetCode&#xff09; 二、代码 交换律&#xff1a;a ^ b ^ c <> a ^ c ^ b 任何数与0异或为任何数 0 ^ n >…

第三篇|金融人数据来源有哪些

数据对于金融行业真的很重要&#xff0c;那么金融人有哪些途径查数据呢&#xff1f; 国内&#xff1a; 1. 国家统计局 这个应该是无论什么行业都使用最频繁的网站&#xff0c;每个月都会固定发上个月资产投资数据 、工业增加值和利润数据等常规数据&#xff0c;其他数据也会…

日常BUG—— maven编译报错

&#x1f61c;作 者&#xff1a;是江迪呀✒️本文关键词&#xff1a;日常BUG、BUG、问题分析☀️每日 一言 &#xff1a;存在错误说明你在进步&#xff01; 一、问题描述 一个maven项目在由于在代码中书写了如下代码&#xff1a; public static ConcurrentMap<…