el-table指定行背景颜色更换,并且鼠标移入后行背景色保持不变
思路:通过设置:row-class-name="tableRowClassName" 和 :cell-style="tableCellstyle"
1、设置行变色
<el-table :data="dataList" :row-class-name="tableRowClassName" :cell-style="tableCellstyle" >
methods中写方法:
tableRowClassName(row, rowIndex ) { if (row.row.name == 'test') { return 'rowColor' } return '' },
style中设置class属性:
::v-deep .el-table .rowColor{ background: #f3c298; }
2、置好背景色后发现,每次鼠标移入到变色的行上面,背景色就会变成灰色,要求是移入后也应该是变过色的背景色
tableCellstyle(row, rowIndex) { if (row.row.name == 'test') { return 'background: #f3c298' } return '' },