动态校验列表数据方案

背景:当select 选择A 的时候是必填,选B的时候是非必填
那么我们需要监听 selec 变化时候对 列表的 :edit-rules=“validRulesList” 进行重新赋值必填校验的true, (跟对列表内上传文件,对列表文件进行赋值名字一样道理,通过获取对应的校验值,或者列表对应的字段进行赋值)
在这里插入图片描述

Rules列表

validRules: {
warrantyManualDescr:[{ required: false, message: this.$t('test') }],
warrantyManualUpload:[{ required: false, message: this.$t('test') }],
 }

通过获取对应的校验值进行赋值,注意在改变的时候,会因为列表是数组,最下面的值的改变会影响到其他数据的必填值,所以需要else 对整个表进行查询处理,查到就 return 节约时间

async ptypeChangeEvent (row, id) {
 this.validRulesList.warrantyManualDescr[0].required = (id.value === 'a')?true:false
 this.validRulesList.warrantyManualUpload[0].required = (id.value === 'a')?true:false
 if(id.value === 'a') {
     this.validRulesList.warrantyManualDescr[0].required = true
     const $table = this.$refs.sublistTableData;
     const errMap = await $table.validate(true)
 }else {
   for(let i=0; i<this.sublistTableData.length; i++) {
       let e = this.sublistTableData[i]
       if(e.warrantyManualNorm == 'UNSWD') {
           this.validRulesList.warrantyManualDescr[0].required = true
           const $table = this.$refs.sublistTableData;
           const errMap = await $table.validate(row.row)
           return
       }
   }
 }
},

提交 submit 按钮的时候操作
对存在 必填字段的值查到 就 return 防止循环到下一个不是必填的字段(注意我们是在列表中进行判断,循环不做 return 会 继续到最后,出现 校验弹框 又被覆盖的情况)
通过对是否存在要校验的列表进行收集,对以后的计算进行拦截

/*字表校验操作*/
const $table = this.$refs.sublistTableData;
let arr = []
for(let i=0; i<this.sublistTableData.length; i++) {
    let e = this.sublistTableData[i]
    if(e.warrantyManualNorm == 'a') {
        const errMap = await $table.validate(e)
        if(errMap) {
          arr.push(errMap)
          return
        }
    }
}
if(arr.length>0) {
    return false
}

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Kubernetes云原生存储解决方案openebs部署实践-4.0.1版本(helm部署)

Kubernetes云原生存储解决方案openebs部署实践-4.0.1版本&#xff08;helm部署&#xff09; 简介 OpenEBS 是一种开源云原生存储解决方案。OpenEBS 可以将 Kubernetes 工作节点可用的任何存储转化为本地或复制的 Kubernetes 持久卷。OpenEBS 帮助应用和平台团队轻松地部署需要…

后端之路——文件本地上传

一、基础原理 文件上传是一个很基础的知识点&#xff0c;尤其是本地上传&#xff0c;在现实开发基本都是云上传&#xff0c;但是作为一个基础要简单了解一下 首先前端我就不多讲解了&#xff0c;网页开发里用<form>表单可以上传文件&#xff0c;只需要加上这三属性&…

【HarmonyOS NEXT】鸿蒙如何动态添加组件(NodeController)

NodeController用于实现自定义节点的创建、显示、更新等操作的管理&#xff0c;并负责将自定义节点挂载到NodeContainer上。 说明 本模块首批接口从API version 11开始支持 当前不支持在预览器中使用NodeController。 导入模块 import { NodeController } from "ohos…

面试官:JVM调优,主要针对是哪一个区域?JVM内存结构是怎样的?

作为一个Java程序员&#xff0c;在日常的开发中&#xff0c;不必像C/C程序员那样&#xff0c;为每一个内存的分配而操心&#xff0c;JVM会替我们进行自动的内存分配和回收&#xff0c;方便我们开发。但是一旦发生内存泄漏或者内存溢出&#xff0c;如果对Java内存结构不清楚&…

【情绪ABC理论】你为什么生气?清理一下情绪垃圾吧!

心理学有一个著名的情绪ABC理论&#xff0c;认为人的情绪并不是由事件本身引起的&#xff0c;而是由对事件的看法所导致&#xff0c;情绪的困扰某种程度与我们的不合理信念有关。在无法改变事物本身时&#xff0c;转变自己的认识有助于保持阳光心情。 什么是ABC法则&#xff1…

2024最全前端面试系列(计算机网络)(非科班出身最薄弱的环节)

2020最全前端面试系列&#xff08;CSS&#xff09; 2020最全前端面试系列&#xff08;VUE&#xff09; 2020最全前端面试系列&#xff08;浏览器原理&#xff09; 2020最全前端面试系列&#xff08;数据结构&#xff09; 常见状态码 | | 类别 | 原因短语 | | — | — | —…

申请SSL证书 SSL是如何保护网站安全的

随着互联网的不断发展&#xff0c;网络安全问题日益凸显&#xff0c;特别是在数据传输和存储方面。为了保护网站和用户的数据安全&#xff0c;SSL&#xff08;安全套接层&#xff09;技术应运而生&#xff0c;成为了保护网站安全的重要工具。本文将详细介绍SSL如何保护网站安全…

2024-07-04 base SAS programming学习笔记8(HTML)

当使用ODS来进行结果或数据集输出的时候&#xff0c;可以同时设置多个ODS 命令&#xff0c;同时输出到多个不同的文件。使用_ALL_ 表示关闭所有的ODS输出窗口&#xff0c;比如&#xff1a; ods html file(body)"html-file-pathname"; ods html file"pdf-file-pa…

React、JSX简介、渲染列表、基础和复杂的条件渲染

目录 一、简介 1、搭建环境 2、回到项目&#xff08;VScode&#xff09; 3、项目核心渲染路径 4、网站资料&#xff08;启动项目的方法&#xff09; 二、JSX 三、实现渲染列表 四、实现条件渲染 五、实现复杂条件渲染 一、简介 1、搭建环境 npx creat-react-app reac…

【 VIPKID-注册安全分析报告】

前言 由于网站注册入口容易被黑客攻击&#xff0c;存在如下安全问题&#xff1a; 暴力破解密码&#xff0c;造成用户信息泄露短信盗刷的安全问题&#xff0c;影响业务及导致用户投诉带来经济损失&#xff0c;尤其是后付费客户&#xff0c;风险巨大&#xff0c;造成亏损无底洞 …

Soildwoker学习(特征学习4)

本节学习内容&#xff1a; 1、异性孔向导 2、螺纹孔的选择 M6 六角圆柱头螺钉 M6 螺纹孔 3、线性阵列 4、基准轴 5、镜像 特征镜像 实体镜像

Swagger php注解常用语法梳理

Swagger php注解常用语法梳理 快速编写你的 RESTFUL API 接口文档工具&#xff0c;通过注释定义接口和模型&#xff0c;可以和代码文件放置一起&#xff0c;也可以单独文件存放。 Swagger 优势 通过代码注解定义文档&#xff0c;更容易保持代码文档的一致性模型复用&#xff0…

Spring Boot中使用SpringEvent组件

Spring的事件机制是基于观察者模式的实现&#xff0c;主要由以下三个部分组成&#xff1a; 事件&#xff08;Event&#xff09;&#xff1a;事件是应用中发生的重要事情&#xff0c;通常是一个继承自ApplicationEvent的类。 事件发布器&#xff08;Publisher&#xff09;&…

ubuntu使用官方deb文件安装指定版本cuda失败,总是装成最新版

之前安装过最新版的cuda&#xff0c;之后想换用旧版&#xff0c;但是按照官网的说明&#xff0c;sudo apt-get -y install cuda后总是装成最新版的。 解决方法&#xff1a; 最后一步使用sudo apt-get -y install cuda-x-x&#xff0c;直接指定你要安装的cuda的版本号。

python作业一

1. #A. num int(input("请输入要打印的层数:")) for n in range(1, num1):s ""for i in range(1, n1):s f"{i}" " "print(s)#B. num int(input("请输入要打印的层数:")) for i in range(num1, 0, -1):s" "f…

springcloud+vue项目,controller层接口返回json数据,前端可以接收到数据,但浏览器“F12-->网络-->响应“显示为空的问题处理

1.显示为空的场景 SharetekR(access_tokeneyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJsb2dpblR5cGUiOiJsb2dpbiIsImxvZ2luSWQiOiJQQzoxODA1ODA4ODc1MjUwMTIyNzUyIiwicm5TdHIiOiJrZEoxV05CV3NBSUdYb05TbktSU3kzOGNuSnk3c3FRTSIsInVzZXJJZCI6MTgwNTgwODg3NTI1MDEyMjc1MiwidXNlck5h…

分布式数据库HBase:从零开始了解列式存储

在接触过大量的传统关系型数据库后你可能会有一些新的问题: 无法整理成表格的海量数据该如何储存? 在数据非常稀疏的情况下也必须将数据存储成关系型数据库吗? 除了关系型数据库我们是否还有别的选择以应对Web2.0时代的海量数据? 如果你也曾经想到过这些问题, 那么HBase将是…

25届最近5年华北电力大学自动化考研院校分析

华北电力大学&#xff08;北京保定&#xff09; 目录 一、学校学院专业简介 二、考试科目指定教材 三、近5年考研分数情况 四、近5年招生录取情况 五、最新一年分数段图表 六、初试大纲复试大纲 七、学费&奖学金&就业方向 一、学校学院专业简介 二、考试科目指…

【C语言】刷题笔记 Day2

【笔记】 【1】局部变量不初始化&#xff0c;默认放的随机值。 1 int n0; 2 scanf("%d",&n); //13.141 【2】这里虽然输入的是一个浮点数&#xff0c;但是只取整数部分。 【3】3.156e7 表示的是3.156*10的7次方。 【4】多组输入&#xff0c;保存和不保存…