vue 项目中 使用vxe-grid 表格中给表格的表头设置特殊的格式 , 并且给指定的列文字设置颜色

news2024/9/21 2:39:30

项目场景:

相关背景:

vue 项目中 使用vxe-grid 表格中给表格的表头设置特殊的格式,并为指定的列文字设置颜色


实现方案:

具体实现方法及步骤:

一、给表格的表头设置特殊的格式

在这里插入图片描述
实现方式一:

   :header-row-style="{'background-color': '#ffffff','color':'#7a8794'}"

实现方式二:

   :header-row-style="tableHeaderColor"


// 调用方法
tableHeaderColor({row , column , rowIndex , columnIndex}){
      if(columnIndex === 1) {
        return 'color: #0a8cea'; //  给该表头设置为蓝色
      }
      return 'color: #000'; // 默认颜色
    },

二、给表格的表头设置特殊的格式

在这里插入图片描述

步骤一:
添加属性::cell-style=“cell” ,调用 cell 方法

步骤二:
method里声明 cell 方法

cell({row , column , rowIndex , columnIndex}){
if(columnIndex === 1) {
return ‘color: #0a8cea’; // 给指定列设置蓝色
}
return ‘color: #000’; // 默认颜色
},

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

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

相关文章

WebDeveloper靶机复现

靶机设置 设置靶机为NAT模式 靶机IP发现 nmap 192.168.112.0/24 靶机ip为192.168.112.137 目录扫描 开放80端口,进行目录扫描 dirb 192.168.112.137 访问浏览器 目录拼接 拼接/ipdata 发现了一个流量包 在wireshark里面查看,发现wordpress的账户…

python提取b站视频的音频(提供源码

如果我想开一家咖啡厅,那么咖啡厅的音乐可得精挑细选!又假设我非常喜欢o叔,而o叔只在b站弹钢琴,那这时候我就得想方设法把b站的视频转为音频咯! 一、首先打开网页版bilibili,按F12: 二、刷新页面…

Java 空值与null 形参与实参学习

Java系列文章目录 文章目录 Java系列文章目录一、前言二、学习内容:三、问题描述四、解决方案:4.1 空值与null的区别4.1.1 空值(Empty Value)4.1.2 Null 4.2 形参与实参区别 五、总结:5.1 学习总结: 一、前…

智慧高速路三维可视化解决方案

项目背景 随着科技的快速发展,智慧高速公路的建设已成为交通领域的重要趋势。国家和相关部委陆续发布多项政策指导智慧公路建设,逐步制定相关建设标准规范,协助推动公路数字化、智能化升级。 方案简介 数字孪生高速公路解决方案是一种集成…

练习实践-基础设施-文件共享-FTP服务搭建-匿名/本地用户/虚拟用户三种模式

参考来源: 在线书籍-linux就该这么学-第11章 安装vsftpdf服务 [rootcentos7 home]# dnf install vsftpd Extra Packages for Enterprise Linux 7 - x86_64 0. CentOS-7 - Base - mirrors.aliyun.com …

C语言中的整数和浮点数在内存中存储

在C语言中,整形和浮点型数据的存储方式有所不同。 对于整形数据,C语言使用补码表示法存储。补码表示法可以方便地进行二进制加减法运算,同时能够简化硬件设计。对于正整数,其补码与原码相同,即直接存储其二进制表示。对…

Spring 循环依赖解决方案

文章目录 1. 循环依赖的产生2. 循环依赖的解决模型3. 基于setter/Autowired 的循环依赖1_编写测试代码2_初始化 Cat3_初始化 Person4_ 回到 Cat 的创建流程5_小结 4. 基于构造方法的循环依赖5. 基于原型 Bean 的循环依赖6. 引人AOP的额外设计7. 总结 IOC 容器初始化bean对象的逻…

如何对open62541.h/open62541.c的UA_Client进行状态(在线/掉线)监控

文章目录 1.背景2.解决方案3.异步连接4.注意事项4.1.线程问题4.2.UA_Client_run_iterate 1.背景 目前在利用open62541.h/open62541.c编写了一个与PLC进行OPCUA通讯的上位机程序。 上位机这边会定时对PLC的某个opcua变量进行写操作。但是假如PLC离线或者说拔掉网线,…

【多线程-从零开始-柒】单例模式,饿汉和懒汉模式

单例模式:是一种设计模式 设计模式,类似于“棋谱”,就是固定套路,针对一些特定的场景,给出一些比较好的解决方法只要按照设计模式来写代码,就可以保证代码不会太差,保证代码的下限 设计模式 设…

8月8日学习笔记 python基础

1.环境 python2, python3 yum list installed|grep python yum -y install python3 # 最新安装3.12可以使⽤源码安装,教程是在第⼀个星期pdf python3 --version 3.6.8 #进⼊到python的编辑状态 python3 # 如果直接输⼊python,也会进⼊到pyth…

MySQL基础练习题33-有趣的电影

目录 题目 准备数据 分析数据 总结 题目 找出所有影片描述为 非 boring (不无聊) 的并且 id 为奇数 的影片。 返回结果按 rating 降序排列。 准备数据 ## 创建库 create database db; use db;## 创建表 Create table If Not Exists cinema (id int, movie varchar(255),…

php根据截止时间计算剩余的时间,并且在剩余时间不足1天时仅显示小时数

//获取政策库文章public function getIndexZckList(){$fl_id = input(fl_id);if(empty(

C++:list类(迭代器类)

前言 list是链表的意思 它属于链表中的带头双向循环链表 建议先掌握数据结构中的链表 C数据结构:单链表-CSDN博客 C数据结构:双向链表(带头循环)_c带头双向循环链表-CSDN博客 数据结构 首先我们需要一个链表的节点 templa…

ThinkPHP5漏洞分析之代码执行

漏洞概要 本次漏洞存在于 ThinkPHP 的缓存类中。该类会将缓存数据通过序列化的方式,直接存储在 .php 文件中,攻击者通过精心构造的 payload ,即可将 webshell 写入缓存文件。缓存文件的名字和目录均可预测出来,一旦缓存目录可访问…

【张】#12 enum 枚举

enum 枚举定义格式&#xff1a; enum <类型名> {<枚举常量表> }; 枚举其实就是一个整数 enum example {Aa,Bb10,Cc //给Bb赋值为10后&#xff0c;Cc的值会变成11 }; 枚举变量只能使用枚举值&#xff0c;枚举可以赋值给整型&#xff0c;整型不能赋值给枚举 #inc…

掌握Jenkins自动化部署:从代码提交到自动上线的全流程揭秘

Jenkins自动化部署是现代软件开发中不可或缺的一部分&#xff0c;它不仅简化了代码的发布过程&#xff0c;还为整个团队带来了无与伦比的效率和协作力。想象一下&#xff0c;开发者们可以专注于编写高质量的代码&#xff0c;而不是为繁琐的手动部署所烦恼&#xff1b;测试人员能…

力扣高频SQL 50题(基础版)第四十四题之626. 换座位

文章目录 力扣高频SQL 50题&#xff08;基础版&#xff09;第四十四题之626. 换座位626. 换座位题目说明思路分析实现过程准备数据实现方式结果截图 力扣高频SQL 50题&#xff08;基础版&#xff09;第四十四题之626. 换座位 626. 换座位 题目说明 表: Seat --------------…

<数据集>街头摊贩识别数据集<目标检测>

数据集格式&#xff1a;VOCYOLO格式 图片数量&#xff1a;966张 标注数量(xml文件个数)&#xff1a;966 标注数量(txt文件个数)&#xff1a;966 标注类别数&#xff1a;1 标注类别名称&#xff1a;[street-vendor] 序号类别名称图片数框数1street-vendor9662016 使用标注…

Java流程控制02:if选择结构

本节内容教学视频链接&#xff1a;Java流程控制04&#xff1a;if选择结构_哔哩哔哩_bilibilihttps://www.bilibili.com/video/BV12J41137hu?p36&vd_sourceb5775c3a4ea16a5306db9c7c1c1486b5 在Java中&#xff0c;if 选择结构用于根据特定条件执行不同的代码块。 if语句有四…