ant Design of vue 实现table每栏动态根据条件设置背景颜色(table栏每一栏颜色自定义)

news2024/11/28 6:29:39

效果图:
在这里插入图片描述
注意效果图中,table的表格每一栏颜色都要不一样

代码实现:

页面结构:

 <a-table :columns="columns" :loading="tableLoading" :data-source="tableData" rowKey='id' size="middle"
      :rowClassName="rowClassName">
         <template slot="operate" slot-scope="text, record">
         <p class="detailP" @click="openModel(text, record)">详情 </p>
         </template>
</a-table>

方法:

  rowClassName(record, index) {
      return index % 2 == 0 ? "first" : "second";
  },

样式:

/deep/.ant-table-tbody .first {
    background-color: #061236 !important;
}

/deep/.ant-table-tbody .second {
    background-color: #071641 !important;
}

关键点:通过rowClassName这个属性去动态根据条件设置样式

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

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

相关文章

IntelliJ IDEA开启git版本控制的简单教程

这篇文章想要分享一下怎么在IntelliJ IDEA开启版本控制&#xff0c;博主使用的是gitee&#xff0c;首先需要安装git&#xff0c;关于git的安装这里就不介绍了&#xff0c;很简单。 目录 创建git仓库 创建项目 开启版本控制 拉取项目 创建git仓库 首先&#xff0c;需要登录…

C++ 模拟实现vector

目录 一、定义 二、模拟实现 1、无参初始化 2、size&capacity 3、reserve 4、push_back 5、迭代器 6、empty 7、pop_back 8、operator[ ] 9、resize 10、insert 迭代器失效问题 11、erase 12、带参初始化 13、迭代器初始化 14、析构函数 完整版代码 一、…

Python 调用 Halcon 模板匹配实现目标定位

一、Halcon 当谈及计算机视觉领域中强大的工具和框架时&#xff0c;Halcon&#xff08;由德国MVTec 公司开发&#xff09;无疑是一个备受关注的系统。Halcon被广泛用于工业视觉和机器视觉应用中&#xff0c;其强大的功能和灵活性使其成为许多开发人员和研究人员的首选选择。 …

【合集】SpringBoot——Spring,SpringBoot,SpringCloud相关的博客文章合集

前言 本篇博客是spring相关的博客文章合集&#xff0c;内容涵盖Spring&#xff0c;SpringBoot&#xff0c;SpringCloud相关的知识&#xff0c;包括了基础的内容&#xff0c;比如核心容器&#xff0c;springMVC&#xff0c;Data Access&#xff1b;也包括Spring进阶的相关知识&…

支持大模型训练的计算机系统

摘要&#xff1a; 训练数据决定了基础大模型可用的理论信息&#xff0c;模型架构和训练目标决定了可以提取多少信息&#xff0c;计算机系统决定了实际可实现的内容。在数据和模型大小方面&#xff0c;系统是扩展的关键瓶颈&#xff0c;这两者似乎都可以可靠地跟踪能力的改进。在…

Bypass open_basedir

讲解 open_basedir是php.ini中的一个配置选项&#xff0c;可用于将用户访问文件的活动范围限制在指定的区域。 假设open_basedir/var/www/html/web1/:/tmp/&#xff0c;那么通过web1访问服务器的用户就无法获取服务器上除了/var/www/html/web1/和/tmp/这两个目录以外的文件。…

【网络安全】vulhub靶场搭建与一个漏洞的简单示例

vulhub是一个经典的靶场&#xff0c;里面大约包含了200个不同的漏洞&#xff0c;可以说是安全从业者必刷。 无需docker知识&#xff0c;简单执行一条命令即可编译、运行一个完整的漏洞靶场镜像。 我的环境是CentOS 7。 先安装docker sudo curl -L "https://github.com…

Linux-帮助命令的使用和练习(type、man、help、info详解)

目录 5.3.1 type-判断是否为内部命令 5.3.2 man-查看详细文档 5.3.3 help-查看shell内部命令的帮助信息 5.3.4 --help-查看系统外部命令帮助信息 5.3.5 info-查看info格式的帮助指令 5.3.6 /usr/share/doc-存储软件包的文档信息 平时我们看到的命令大多数都可以查看帮助文…

Redis有序集合对象

一.编码 有序集合的编码可以是ziplist或者skiplist。 ziplist编码的有序集合对象使用压缩列表作为底层实现&#xff0c;每一个集合元素使用紧挨在一起的两个压缩列表节点来保存。第一个节点保存元素的成员(member)&#xff0c;而第二个元素则保存元素的分值(score)。 127.0.0.…

全面解析“由于找不到hid.dll,无法继续执行代码”的4个解决方法

在计算机使用过程中&#xff0c;我们经常会遇到一些错误提示&#xff0c;其中之一就是“找不到hid.dll”。这个问题通常出现在尝试运行某个程序或访问某个设备时。那么&#xff0c;当我们遇到这个问题时&#xff0c;应该如何解决呢&#xff1f;本文将详细介绍找不到hid.dll的解…

Java第二十一章总结

网络编程三要素 ip地址&#xff1a;计算机在网络中的唯一标识 端口&#xff1a;应用程序在计算机中唯一标识 协议&#xff1a;通信协议&#xff0c;常见有UDP和TCP协议 InetAddress类 表示Internet协议地址 //返回InetAddress对象 InetAddress byName InetAddress.…

程序员的养生之道

程序员的养生之道 1 对程序员的初次印象2 我的养生之道2.1 规律作息&#xff1a;2.2 合理饮食&#xff1a;2.3 健康饮食&#xff1a;2. 4 增强锻炼&#xff1a;2. 5 心态平和&#xff1a;2. 6 生活习惯&#xff1a;2.7 定期体检&#xff1a;2.8 特殊注意&#xff1a;2.9 补充能…

Zookeeper系统性学习-应用场景以及单机、集群安装

Zookeeper 是什么&#xff1f; Zookeeper 为分布式应用提供高效且可靠的分布式协调服务&#xff0c;提供了诸如统一命名服务、配置管理和分布式锁等分布式的基础服务。在解决分布式数据一致性方面&#xff0c;ZooKeeper 并没有直接采用 Paxos 算法&#xff0c;而是采用了名为 …

微表情检测(三)----基于光流特征的微表情检测

Micro-expression spotting based on optical flow features 基于光流特征的微表情检测 Abstract 本文提出了一种高精度和可解释性的自动微表情检测方法。首先&#xff0c;我们设计了基于鼻尖位置的图像对齐方法&#xff0c;以消除由头部晃动引起的全局位移。其次&#xff0…

C# Winform 日志系统

目录 一、效果 1.刷新日志效果 2.单独日志的分类 3.保存日志的样式 二、概述 三、日志系统API 1.字段 Debug.IsScrolling Debug.Version Debug.LogMaxLen Debug.LogTitle Debug.IsConsoleShowLog 2.方法 Debug.Log(string) Debug.Log(string, params object[]) …

lv12 系统移植导学 1

1 导学 Kernel学习主要包括三块内容&#xff0c;ARM&#xff08;汇编、协议&#xff09;、系统移植、驱动移植 lv12主要时安装系统linux linux主要帮我们实现了5大功能 1 进程、线程管理 2 内存管理 3 网络协议栈管理 4 文件系统管理 5 设备管理 2 移植的目的 不同架构…

ptmalloc:从内存虚拟化说起

前言 本文并不局限于ptmalloc的原理&#xff0c;而是从linux的内存虚拟化和系统调用原理出发&#xff0c;结合各种语言实现&#xff0c;讲明内存分配方面的trade off&#xff0c;力图事无巨细&#xff0c;追根究底。本文内容包括但不限于&#xff1a;NIO原理、0拷贝原理、内存…

AirServer 5.63中文破解2024最新图文安装激活教程含许可证

AirServer是一款便捷式投屏软件&#xff0c;它的主要功能在于实时地将移动设备上的图像画面内容投放到电脑设备上&#xff0c;让电脑成为iPad、iPhone等iOS系统设备的大屏显示器。 在设备之间建立局域网内的信号发送与接收通道&#xff0c;确保数据可以稳定安全地进行传输。下面…

大模型对数据分布变化的鲁棒性研究综述

摘要&#xff1a; 标准机器学习的一个主要限制是它产生的模型对分布变化不鲁棒&#xff0c;其中训练分布与测试分布不匹配&#xff08;对于下游任务&#xff09;。现有的工作表明&#xff0c;调整在广泛的未标记数据上训练的基础模型可以提高适应模型在各种变化中的鲁棒性。这为…

【Java 基础】28 字符编码

文章目录 1.字符集2.编码方式1&#xff09;ASCII2&#xff09;UTF-8 编码3&#xff09;UTF-16 编码4&#xff09;ISO-8859-1 编码 3.使用样例Charset 类String 类 4.注意事项结语 字符编码&#xff08;Character Encoding&#xff09;是一种将字符映射为二进制数据的规则或算法…