前言:有的行需要变颜色 所以我们用到了row-class-name方法 但是固定列没有变颜色
<el-table :row-class-name="tableRowClassName">xxx</el-table>
const tableRowClassName = (value) => {
if (JSON.stringify(row.stopApplyType) != 'null') {
console.log('停发')
return 'error-row'
} else {
return ''
}
}
<style>
.el-table .error-row {
--el-table-tr-bg-color: var(--el-color-error-light-9);
}
</style>
这样是非常不美观的 所以我看了一下固定列的css 绑定的class
然后我们在app.vue加入以下代码
.el-table-fixed-column–left 是针对固定在左侧的固定列
.el-table-fixed-column–right 是针对固定在右侧的固定列
//红色的
.el-table .error-row {
--el-table-tr-bg-color: var(--el-color-error-light-9);
}
.el-table .error-row .el-table-fixed-column--left {
background-color: #fef0f0;
}
.el-table .error-row .el-table-fixed-column--right {
background-color: #fef0f0;
}
这样的话就变美观了很多 解决问题!