element-ui使用动态渲染下拉选择框el-select已经选择的下拉框的值不可以重复选择让其disabled

在这里插入图片描述
调接口拿到下拉框数据的数据的时候将其disabled全为true
但是如果编辑的时候就需要与详情接口对比,如果有id一致就将disabled为true

if (res.code == 0) {
           if (this.dialogtitle == "新增合同") {
              res.data.map((v) => {
                v.nameUnitVoList.forEach((item) => {
                  item.disabled = false;
                });
              });
            } else {
              this.tabsOptions.map((v) => {
                v.editableTabs.map((t) => {
                  t.tableProductData.map((n) => {
                    res.data.map((m) => {
                      m.nameUnitVoList.forEach((item) => {
                        if(item.enterpriseProduceId == n.enterpriseProduceId)
                        item.disabled = true;
                      });
                    });
                  });
                });
              });
            }
       }

在下拉框的change事件与删除事件中抽离一个方法

1.如果是flag是del且有name,说明这一行被删除,将当前的name在this.types去掉
否则就是下拉框change,然后将name追加到this.types

2.如果是编辑有的值已经被选择了此时前面接口已处理disabled为true,所以判断如果disabled为true也将name追加到this.types

3.下拉框change改变值的时候,拿到change改变值的之前的值,将其name从this.types筛选掉

4.再将下拉框下拉数据与this.types比较,如果里面name能找到就将其下拉数据disabled 置为true

    nameChange(e, row) {
      this.getChoiceArr(row);
     }
    del(index, row) {
      this.getChoiceArr(row,'del')
      this.tableProductData.splice(index, 1);
      this.$emit("sentdelTableInfo", {});
    }, 
    //抽离一个方法
   getChoiceArr(row,flag) {
      this.types = []
      //preValue === 拿到产品名称下拉框变更之前的值
      const preValue = this.$refs[row.enterpriseProduceId].value
      if (flag == 'del' &&  row.name) {
        //如果是删除就让当前的name在this.types去掉
        this.types = this.types.filter(v=>(v != row.name))
      }else{
        this.types.push(row.name);
      }
      row.options.optionProSize.forEach((t) => {
        //编辑的时候需要将之前选择的disabled是true也要追加进去this.types
        if(t.disabled){
          this.types.push(t.name);
        }
        //console.log(this.types, "types");//|| t.disabled
        //当我们变更值的时候需要将上一个值变成可选的值,筛选掉
        this.types = this.types.filter(v=>(v != preValue))
        if (this.types.indexOf(t.name) !== -1) {
          t.disabled = true;
        } else {
          t.disabled = false;
        }
      });
    },  

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

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

相关文章

小程序新渲染引擎 Skyline 发布正式版

为了进一步提升小程序的渲染性能和体验,我们推出了一套新渲染引擎 Skyline,现在,跟随着基础库 3.0.0 发布 Skyline 正式版。 我们知道,小程序一直用 WebView 来渲染界面,因其有不错的兼容性和丰富的特性,且…

lc209.长度最小的子数组

暴力破解:二次for循环遍历num[i]...num[j],记录满足条件的最小长度 前缀和二分:前缀和降低计算num[i]...num[j]的时间复杂度 对前缀和数组中的每个数进行遍历,找到距离这个数满足条件的最小长度 前缀和数组单调递增,此…

最小时间差(力扣)排序 + 思维 JAVA

给定一个 24 小时制(小时:分钟 “HH:MM”)的时间列表,找出列表中任意两个时间的最小时间差并以分钟数表示。 示例 1: 输入:timePoints [“23:59”,“00:00”] 输出:1 示例 2: 输入:…

支持向量机(iris)

代码: import pandas as pd from sklearn.preprocessing import StandardScaler from sklearn import svm import numpy as np# 定义每一列的属性 colnames [sepal-length, sepal-width, petal-length, petal-width, class] # 读取数据 iris pd.read_csv(data\\i…

[自然语言处理] 自然语言处理库spaCy使用指北

spaCy是一个基于Python编写的开源自然语言处理库。基于自然处理领域的最新研究,spaCy提供了一系列高效且易用的工具,用于文本预处理、文本解析、命名实体识别、词性标注、句法分析和文本分类等任务。 spaCy的官方仓库地址为:spaCy-github。本…

信号的学习笔记二

文章目录 信号捕捉signal信号捕捉sigaction信号集未决信号集和阻塞信号集的工作过程 ![在这里插入图片描述](https://img-blog.csdnimg.cn/b896346af6f1462089779e513a7e237b.png)信号集相关函数sigemptysetsigfillsetsigaddsetsigdelsetsigismember应用 以下函数设置内核信号集…

八股总结(八)SSM框架体系

文章目录 Spring基础1、Spring、SpringMVC、Mybatis与SpringBoot的区别2、Spring中常用的注解及作用 Spring IoC 、 DI、Bean3、Spring IoC是什么,有什么好处,Spring中是怎么实现的?4、Bean相关5、Component 和 Bean 的区别是什么&#xff1f…

Java-简单认识类和对象

一、初步认识面向对象 1.1 什么是面向对象 Java是一门纯面向对象的语言(Object Oriented Program,简称OOP),在面向对象的世界里,一切皆为对象。面向对象是解决问题的一种思想,主要依靠对象之间的交互完成一件事情。用面向对象的思…

系统架构设计师 10:软件架构的演化和维护

一、软件架构演化 如果软件架构的定义是 SA{components, connectors, constraints},也就是说,软件架构包括组件、连接件和约束三大要素,这类软件架构演化主要关注的就是组件、连接件和约束的添加、修改与删除等。 二、面向对象软件架构演化…

使用Appuploader工具将IPA上传到App Store的最新流程和步骤

​ 苹果官方提供的工具xcode上架ipa非常复杂麻烦。用appuploader 可以在 mac 和windows 上制作管理 证书 ,无需钥匙串工具 条件:1.以Windows为例,创建app打包ios需要的证书和描述文件 2.准备好一个苹果开发者账号(如果没有到苹果…

C#实现读写CSV文件的方法详解

目录 CSV文件标准 文件示例RFC 4180简化标准读写CSV文件 使用CsvHelper使用自定义方法总结 项目中经常遇到CSV文件的读写需求,其中的难点主要是CSV文件的解析。本文会介绍CsvHelper、TextFieldParser、正则表达式三种解析CSV文件的方法,顺带也会介绍一…

QGIS3.28的二次开发一:编译工程

环境:VS2019OSGeo4WCMake_3.26Cygwin64QGIS_3.28 注意:一定要按照步骤顺序来! 一、配置环境 (一)VS2019 VS2019下载链接https://my.visualstudio.com/Downloads?qvisual%20studio%202019&wt.mc_ido~msft~vsco…

Java面向对象编程实战详解(图书管理系统示例)

文章目录 面向编程概念图书管理系统示例需求分析设计阶段编码实现创建目录结构Book类的编码BookList类的编码User类的编码AdminUser类的编码NormalUser类的编码启动类的编写具体的操作实现IOperation接口新增图书的实现借阅图书的实现删除图书的实现显示图书的实现查找图书的实…

1.netty介绍

1.介绍 是JBOSS通过的java开源框架是异步的,基于事件驱动(点击一个按钮调用某个函数)的网络应用框架,高性能高可靠的网络IO程序基于TCP,面向客户端高并发应用/点对点大量数据持续传输的应用是NIO框架 (IO的一层层封装) TCP/IP->javaIO和网络编程–>NIO—>Netty 2.应用…

一文讲清楚地图地理坐标系

前言 我最近在做一个和地图有关的项目,这里本人地图采用的是mapbox,其中涉及一个功能需要根据用户输入的地点直接定位到地图上的对应的位置,本人开始想的是直接调用百度的接口根据地名直接获取坐标,发现在地图上的位置有偏移不够…

一、Postfix[安装与配置、smtp认证、Python发送邮件以及防垃圾邮件方法、使用腾讯云邮件服务]

Debian 11 一、安装 apt install postfix 二、配置 1.dns配置 解释:搭建真实的邮件服务器需要在DNS提供商那里配置下面的dns 配置A记录mail.www.com-1.x.x.x配置MX记录www.com-mail.www.com 解释:按照上面的配置通常邮件格式就是adminwww.com其通过…

使用BERT分类的可解释性探索

最近尝试了使用BERT将告警信息当成一个文本去做分类,从分类的准召率上来看,还是取得了不错的效果(非结构化数据强标签训练,BERT确实是一把大杀器)。但准召率并不是唯一追求的目标,在安全场景下,…

python 自动化数据提取之正则表达式

>>>> 前 言 我们在做接口自动化的时候,处理接口依赖的相关数据时,通常会使用正则表达式来进行提取相关的数据,今天在这边和大家聊聊如何在python中使用正则表达式。 正则表达式,又称正规表示式、正规表示法、正规…

K8S:容器日志收集与管理

Kubernetes 里面对容器日志的处理方式,都叫作 cluster-level-logging,即:这个日志处理系统,与容器、Pod 以及 Node 的生命周期都是完全无关的。这种设计当然是为了保证,无论是容器挂了、Pod 被删除,甚至节点…

RabbitMQ部署指南

RabbitMQ部署指南 1.单机部署 我们在Centos7虚拟机中使用Docker来安装。 1.1.下载镜像 方式一:在线拉取 docker pull rabbitmq:3-management方式二:从本地加载 已经提供了镜像包: 上传到虚拟机中后,使用命令加载镜像即可&…