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

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.hqwc.cn/news/69320.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

学习ts(二)数据类型(接口和对象类型、数组类型)

interface 重名会重合到一起 如果两个interface名称相同&#xff0c;会把两个合到一起 重复定义同一个需要类型相同 不能多或者减少属性 设置任意key 当定义接口返回数据时&#xff0c;我们不确定接口会返回多少&#xff0c;知道所需要的固定属性&#xff0c;其余属性可以…

基于JSP的毕业生就业信息管理系统实战-lw(源码)

系列文章目录 基于jspm在线教育资源管理系统-毕设 文章目录 系列文章目录前言一、主要技术jsp技术Mysql数据库SSM三大框架1.Spring的优势:2.Spring MVC的优势:3.Mybatis的优势: 二、系统设计三、功能截图总结 前言 当前&#xff0c;高校毕业生就业工作的重要性不可忽视&#x…

Day 29 C++ STL- 函数对象(Function Object)(仿函数)

文章目录 函数对象概念概念本质 函数对象使用特点示例 谓词——返回bool类型的仿函数谓词概念一元谓词——operator()参数只有一个的谓词二元谓词——operator()参数只有俩个的谓词 内建函数对象&#xff08;Builtin Function Objects&#xff09;内建函数对象概念注意算术仿函…

大数据:Numpy基础应用详解

Numpy基础应用 Numpy 是一个开源的 Python 科学计算库&#xff0c;用于快速处理任意维度的数组。Numpy 支持常见的数组和矩阵操作&#xff0c;对于同样的数值计算任务&#xff0c;使用 NumPy 不仅代码要简洁的多&#xff0c;而且 NumPy 的性能远远优于原生 Python&#xff0c;…

设计HTML5表单

HTML5基于Web Forms 2.0标准对HTML4表单进行全面升级&#xff0c;在保持简便、易用的基础上&#xff0c;新增了很多控件和属性&#xff0c;从而减轻了开发人员的负担。表单为访问者提供了与网站进行互动的途径&#xff0c;完整的表单一般由控件和脚本两部分组成。 1、认识HTML…

Lombok的使用及注解含义

文章目录 一、简介二、如何使用2.1、在IDEA中安装Lombok插件2.2、添加maven依赖 三、常用注解3.1、Getter / Setter3.2、ToString3.3、NoArgsConstructor / AllArgsConstructor3.4、EqualsAndHashCode3.5、Data3.6、Value3.7、Accessors3.7.1、Accessors(chain true)3.7.2、Ac…

Open3D 最小二乘拟合平面(SVD分解法)

目录 一、算法原理二、代码实现三、结果展示1、点云2、拟合结果四、优秀博客本文由CSDN点云侠原创,原文链接。爬虫网站自重。 一、算法原理 本文实现矩阵奇异值分解方法的最小二乘拟合平面。原理如下: 对于得到的 n n

实现文件的拖放功能

文章目录 实现文件的拖放功能1 拖放文件至QT窗口1.1 实现方法1.2 效果演示 2 拖放文件至python脚本2.1 实现方法2.2 效果演示 实现文件的拖放功能 试想一下&#xff0c;我们希望将一个python项目文件夹或者脚本在IDE中打开&#xff0c;无论是去IDE中选择文件夹路径&#xff0c;…

[GAN] 使用GAN网络进行图片生成的“调参人”入门指南——生成向日葵图片

[GAN] 使用GAN网络进行图片生成的“炼丹人”日志——生成向日葵图片 文章目录 [GAN] 使用GAN网络进行图片生成的“炼丹人”日志——生成向日葵图片1. 写在前面&#xff1a;1.1 应用场景&#xff1a;1.2 数据集情况&#xff1a;1.3 实验原理讲解和分析&#xff08;简化版&#x…

什么是前端框架?怎么学习? - 易智编译EaseEditing

前端框架是一种用于开发Web应用程序界面的工具集合&#xff0c;它提供了一系列预定义的代码和结构&#xff0c;以简化开发过程并提高效率。 前端框架通常包括HTML、CSS和JavaScript的库和工具&#xff0c;用于构建交互式、动态和响应式的用户界面。 学习前端框架可以让您更高效…

(7)(7.1) 使用航点和事件规划任务

文章目录 前言 7.1.1 设置Home位置 7.1.2 视频&#xff1a;制作并保存多路点任务 7.1.3 视频&#xff1a;加载已保存的多航点任务 7.1.4 使用说明 7.1.5 提示 7.1.6 自动网格 7.1.7 任务指令 7.1.8 任务结束 7.1.9 任务重置 7.1.10 MIS_OPTIONS 7.1.11 任务再出发 …

解决右键打印html只能识别1页的问题

hello,大家好久不见,昨天在开发中遇到了一个问题,就是在自己开发的网页中右键-->打印&#xff0c;由于页面内容过多&#xff0c;打印出来的内容只被识别到一页。 针对这一问题&#xff0c;查阅了好多资料最终解决啦。 1.问题重现 大家可以看到这个是我们开发的页面,公司需要…