elementUI中table的row-class-name和cell-class-name

我们现在有一个需求,要求指定的行是一个颜色,突出显示重要性,这时候可以使用el-table的row-class-name属性,

因为我是需要再行内传参,所以使用的是这个写法,如果不需要传参,直接如下即可:

复制代码
:row-class-name="editCellClassName"

然后如下,给符合条件的行加上一个样式,然后在样式里面加背景色即可

因为我使用的是scss,所以深度选择器用的是::v-deep,如果使用的是less,也可以用/deep/

但是现在需求改变,觉得一整行都是这个颜色,不太好看,想要符合条件的行的指定列背景色改变,这时候可以使用cell-class-name的属性,写法都是差不多的,只不过cell-class-name的第一个参数的对象里面,是四个属性{row, column, rowIndex, columnIndex},这个时候可以通过rowIndex和columnIndex同时去筛选出符合条件的添加指定样式

相关推荐
坚持就完事了1 分钟前
Linux的重定向符
运维·服务器·前端
爬虫练习生3 分钟前
极验4ast解混淆流程
javascript
踩着两条虫11 分钟前
AI + 低代码实战 | 一文吃透 API 管理、Swagger 导入与全局配置
前端·低代码·ai编程
AI自动化工坊11 分钟前
T3 Code:专为AI编程代理设计的Web IDE技术实践指南
前端·ide·人工智能·ai编程·t3
梦梦代码精16 分钟前
LikeShop 深度测评:开源电商的务实之选
java·前端·数据库·后端·云原生·小程序·php
Mr.E517 分钟前
odoo18 关闭搜索框点击自动弹出下拉框
开发语言·前端·javascript·odoo·owl·odoo18
鹏程十八少19 分钟前
4. 2026金三银四 Android OkHttp 面试核心 45 问:从源码到架构深度解析
android·前端·面试
invicinble21 分钟前
前端技术栈--webpack
前端·webpack·node.js
天籁晴空24 分钟前
微信小程序 静默登录 + 授权登录 双模式配合的设计方案
前端·微信小程序·uni-app
|晴 天|26 分钟前
Vue 3 博客 SEO 优化:Meta 标签、Sitemap、Schema.org 实战
前端·vue.js·dreamweaver