1、需求是这样的表格
2、修改背景样式(rgba(255, 255, 255, 0.08)),由于使用这种透明背景,造成以下现象:
3、发现右侧的固定列样式多一层背景色,无论hover状态还是默认状态都有,很苦恼。
4、后来发现我使用:row-class-name="tableRowClassName";
tableRowClassName: {
// 表格行的类名
type: String,
default: 'rowClass'
};
给类名.rowClass设置行背景样式的时候会重复给操作列设置背景色,造成重叠。
5、故设置去掉固定列背景色就可完美解决(样式我是使用的lang = "scss")
.el-table__fixed-right{
background-color: unset !important;
.el-table__fixed-header-wrapper{
.headClass{
th {
background-color: unset !important;
}
}
}
.el-table__fixed-body-wrapper{
.el-table__body{
.rowClass{
background-color: unset !important;
&.hover-row {
background-color: unset !important;
.colDelBg{
// class-name | 列的 className | 在<el-table-column class-name="colDelBg"></el-table-column>标签上设置列类名
background-color: unset !important;
}
}
}
}
}
}
(仅记录一下问题,大佬不喜勿喷。)