弹框用户勾选过得置灰 或者不显示

news2024/11/13 22:37:51

弹框用户勾选过得置灰 或者不显示
在这里插入图片描述
添加 :disabled=“row.disabled”

        <el-table-column label="名称" width="300">
            <template #default="{ row }">
              <el-radio
              :disabled="row.disabled"
                :label="row.coursesName"
                v-model="selectedRowCourse"
                @change="onCourseChange(row)"
              />
            </template>
          </el-table-column>

一.置灰
每次弹框打开的时候调接口进行数据处理

const getData = () => {
  let params = {
    id:‘111111
  };
  singleCourseSearch(params).then((res) => {
    // courseData.value = res.data.items;
    courseTotal.value = res.data.total;
	
    let  formattedDate=res.data.items
    const idSet = new Set(courseForm.courses.map(item => item.id));
    let courseData11 = formattedDate.map(item => ({
        ...item,
        disabled: idSet.has(item.idGenerator)
      }));
    courseData.value = courseData11
  });

1.拿到接口的数据

 let  formattedDate=res.data.items

2.courseForm.courses【新增数据都会push进去】取出所有id数据

const idSet = new Set(courseForm.courses.map(item => item.id));

3.formattedDate循环添加disabled,只有接口某个数据与新增的数据的id相同,就添加disabled属性

let courseData11 = formattedDate.map(item => ({
    ...item,
    disabled: idSet.has(item.idGenerator)
  }));
courseData.value = courseData11

二:直接filter删除

1.拿到接口的数据

let  formattedDate=res.data.items

2.courseForm.courses【新增数据都会push进去】取出所有id数据

const idSet = new Set(courseForm.courses.map(item => item.id));

3.formattedDate接口的数据idGenerator与新增的数据的id进行比较,如果有的话就筛选掉

  let courseData11 = formattedDate.filter(item => !idSet.has(item.idGenerator));
  courseData.value = courseData11

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

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

相关文章

中秋节如何利用Python发送彩信

中秋节&#xff0c;作为中国传统节日之一&#xff0c;不仅是家人团聚的时刻&#xff0c;也是商家提高销售业绩的黄金时期。在这个充满温情与消费氛围的节日里&#xff0c;合理利用短信平台进行精准营销&#xff0c;可以显著提高企业的销售业绩。 支持免费对接试用乐讯通PaaS平台…

【全网最全】2024年数学建模国赛B题保奖思路+成品论文+matlab/python代码等(后续会更新

您的点赞收藏是我继续更新的最大动力&#xff01; 一定要点击末文的卡片&#xff0c;那是获取资料的入口&#xff01; 一、问题重述 本题聚焦于某电子产品制造企业在生产过程中的决策问题。企业在生产中需采购 和使用两种关键零配件&#xff0c;并在装配过程中面临如何优化质…

让Mac更Mac|明基MA系列显示器上市

凭借出色的性能和设计&#xff0c;MacBook成为了很多人的心头好。可13~16英寸的屏幕&#xff0c;时常让人感到视野受限&#xff0c;就像无边创意中的一道隐形壁垒。想要外接显示大屏&#xff0c;但除了Studio Display等苹果显示器之外&#xff0c;其他品牌的外接显示屏&#xf…

优化器与现有网络模型的修改

一、优化器 optimizer optim.SGD(model.parameters(), lr0.01&#xff08;学习速率&#xff09;, momentum0.9) optimizer optim.Adam([var1, var2], lr0.0001) 一般&#xff0c;学习率的设置&#xff0c;先从大的设置&#xff0c;逐渐变小。 神经网络可以参见上篇文章&am…

【数据库】MySQL-基础篇-函数

专栏文章索引&#xff1a;数据库 有问题可私聊&#xff1a;QQ&#xff1a;3375119339 目录 一、简介 二、字符串函数 三、数值函数 四、日期函数 五、流程函数 一、简介 函数 是指一段可以直接被另一段程序调用的程序或代码。 也就意味着&#xff0c;这一段程序或代码在 M…

【2024国赛C题】高教杯全国大学生数学建模国赛建模过程+完整代码论文全解全析

完整内容在文章末尾阅读全文获取&#xff01; 问题 1是针对不同情况下&#xff0c;该乡村未来几年农作物的最优种植方案的研究。 为解决这个数学建模问题&#xff0c;我们需要构建一个优化模型&#xff0c;考虑到各种限制条件和目标函数。以下是解决问题的步骤&#xff1a; 问…

有源低通/高通滤波器(一阶滤波器+Sallen-Key滤波器+高下降率滤波器)+有源带通滤波器(级联+多重反馈+状态可变)

2024-9-5&#xff0c;星期四&#xff0c;20:40&#xff0c;天气&#xff1a;晴&#xff0c;心情&#xff1a;晴。明天终于又要放假啦&#xff01;继续学习。、 今天继续学习第九章&#xff0c;主要学习内容为&#xff1a;有源低通/高通滤波器(一阶滤波器Sallen-Key滤波器高下降…

极速体验媲美GPT4V的国产开源视觉大模型CogVLM2(赠书)

大家好&#xff0c;我是每天分享AI应用的萤火君&#xff01; 文末赠书 CogVLM2是一款视觉语言模型&#xff08;Visual Language Model&#xff09;&#xff0c;由智谱AI和清华KEG潜心打磨。这款模型是CogVLM的升级版本&#xff0c;支持高达 1344 * 1344 的图像分辨率&#xf…

matter的Commissioning(入网过程)整体流程、加密方式、通信信息结构

在Matter协议中&#xff0c;**控制器负责将新设备加入网络&#xff08;commissioning&#xff09;**的整个流程&#xff0c;这一过程包括设备的发现、验证、授权、加入Fabric&#xff0c;以及最终建立数据通信的步骤。配网完成后的数据通信过程同样遵循严格的加密方式&#xff…

冠军品质!凯伦股份又一产品荣获省级制造业单项冠军

近日&#xff0c;唐山凯伦新材料科技有限公司获得河北省工业和信息化厅颁发的“河北省制造业单项冠军”证书&#xff0c;公司生产的“抗流挂聚氨酯防水涂料”获得该项省级荣誉。 据了解&#xff0c;省级制造业单项冠军代表着河北省细分行业最高的发展水平、最强的市场实力&…

HarmonyOS开发实战( Beta5版)Stack组件实现滚动吸顶效果实现案例

介绍 本示例介绍运用Stack组件以构建多层次堆叠的视觉效果。通过绑定Scroll组件的onScroll滚动事件回调函数&#xff0c;精准捕获滚动动作的发生。当滚动时&#xff0c;实时地调节组件的透明度、高度等属性&#xff0c;从而成功实现了嵌套滚动效果、透明度动态变化以及平滑的组…

kubesphere缩短node notready后pod驱逐时长(pod-eviction-timeout无效)

本文在测试k8s高可用时会关闭某个node节点&#xff0c;然后看某些pod节点是否主动漂移到其他node节点&#xff0c;测试确实可以&#xff0c;但是时长为5分钟&#xff0c;这个时间长度项目上是不能接受的&#xff0c;比如尝试缩短这个时长&#xff0c;搜到更多的配置都是pod-evi…

Docker打包镜像

Docker打包镜像 前置工作 1.虚拟机中配置好docker环境&#xff0c;并导入nginx&#xff0c;mysql&#xff0c;jdk的镜像 2.下载docker for windows 用idea打包镜像和创建容器需要这个东西支持 下载安装包后执行&#xff0c;无脑回车即可 3.idea中配置docker连接 完成配置后&…

One-Shot Imitation Learning

发表时间&#xff1a;NIPS2017 论文链接&#xff1a;https://readpaper.com/pdf-annotate/note?pdfId4557560538297540609&noteId2424799047081637376 作者单位&#xff1a;Berkeley AI Research Lab, Work done while at OpenAI Yan Duan† , Marcin Andrychowicz ‡ ,…

上门家政系统小程序开发产品类目分析

在当今数字化时代&#xff0c;上门家政服务系统作为连接用户与家政服务供应商的重要桥梁&#xff0c;正逐步渗透到人们的日常生活中&#xff0c;为繁忙的现代人提供了极大的便利。作为一名程序员&#xff0c;我将从产品类目、技术实现及市场影响等角度&#xff0c;对上门家政系…

AI写的论文查重率高吗?分享6款实测AI论文生成免费网站

在当今学术研究和论文写作领域&#xff0c;AI技术的迅猛发展为研究人员提供了极大的便利。特别是AI论文自动生成助手&#xff0c;它们不仅能够提高写作效率&#xff0c;还能帮助生成高质量的论文内容。以下是六款经过实测且免费的AI论文生成网站推荐&#xff1a; 一、千笔-AIP…

linux离线安装nacos

1、打开 Nacos-GitHub &#xff0c;点击 Release 可以看到 Nacos 的各版本跟新信息和安装包之类的 点击下载nacos-server-2.4.1.tar.gz&#xff0c;在linux创建nacos文件夹&#xff0c;把下载好的文件上传到nacos文件夹&#xff0c;并通过命令解压:tar -zxvf nacos-server-2.4.…

CUDA统一内存:简化GPU编程的内存管理

CUDA统一内存&#xff1a;简化GPU编程的内存管理 在现代GPU编程中&#xff0c;内存管理一直是开发者面临的一个重要挑战。特别是在使用NVIDIA CUDA进行高性能计算时&#xff0c;如何在CPU和GPU之间高效地传输数据、以及如何管理这些数据的生命周期&#xff0c;都是影响程序性能…

ABAP 调试宏DEFINE

文章目录 调试过程完整程序 调试过程 完整程序 REPORT Z_TEST_DEFINE.TYPES: BEGIN OF GTY_DATA,NAME TYPE STRING,AGE TYPE I,END OF GTY_DATA. DATA: GS_DATA TYPE GTY_DATA,GT_DATA TYPE TABLE OF GTY_DATA. DEFINE D_TEST.GS_DATA-NAME &1.GS_DATA-AGE &2.APPE…

Linux基础网络编程-Socket通信

本文使用C语言&#xff0c;在Centos实现Socket两种通信类型(TCP和UDP) 文章目录 一、安装gcc二、使用TCP协议&#xff0c;实现Socket(SOCKE_STREAM)流式通信1. 编写TCP_server.c函数和参数解释 2.编写TCP_client.c函数和参数解释 3. 编译并运行上述两个文件3.1 编译3.2 运行(启…