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同时去筛选出符合条件的添加指定样式

相关推荐
志尊宝8 分钟前
Vue3 零基础每日笔记(085):项目上线前 Checklist——环境变量、报错监控、安全自查
前端·javascript·笔记·安全·信息可视化·echarts
朱涛的自习室17 分钟前
我让 Gemini 4 当高管、DeepSeek 当员工,开了一家软件公司(Day 1)
android·前端·人工智能
志尊宝20 分钟前
Vue3 零基础每日笔记(088·完结):从零到一——一个完整 Vue3 项目的成长复盘
前端·javascript·vue.js·笔记·ecmascript·#vue.js
deli00724 分钟前
加一台机器,为什么只有 1/N 的 key 要搬家?一致性哈希实测
前端
兔子零102427 分钟前
FastAPI 零基础入门教程:写过 Node.js,就能轻松学会 Python 后端开发(一)
前端·后端·python
传人once30 分钟前
企业官网静态页基础结构如何搭
javascript·css
桔筐34 分钟前
Vue中DOM的data-*自定义属性(dataset)与Vue data响应式变量区别详解
前端·javascript·vue.js
damoluomu39 分钟前
静态站点生成器怎么选:Node.js 生态里常用的五个(番外一)
javascript·css·typescript·node.js·html
vipxieliang44 分钟前
JavaScript 执行上下文与调用栈:从原理到调试实战
前端·javascript
小马过河R1 小时前
EdgeOne深度解析:从原理、适用场景到COS接入的技术逻辑
java·开发语言·前端·spring·cos