- 改变表格行背景色
el-table :cell-style="TableCellStyle"
//设置表格背景颜色
TableCellStyle(row: any, column: any, rowIndex: any, columnIndex: any) {
if (!row.columnIndex) {
return 'background-color: #e2e7ea';
} else {
if (row.columnIndex < 11) {
return 'background-color: #e2e7ea';
} else {
return null;
}
}
}- 改变行文字颜色
方案一文章来源：https://www.toymoban.com/news/detail-801275.html
el-table :row-class-name="tableAddClass"
tableAddClass({row,rowIndex}) {
if (row.is_halt) {
return 'tr-red';
}
return '';
}
<style scoped>
.el-table .tr-red {
color: red !important;
}
</style>方案二文章来源地址https://www.toymoban.com/news/detail-801275.html
el-table :cell-style="TableCellStyle"
//设置表格背景颜色
TableCellStyle(row: any, column: any, rowIndex: any, columnIndex: any) {
if (!row.columnIndex) {
return 'color: #e2e7ea';
} else {
if (row.columnIndex < 11) {
return 'color: #e2e7ea';
} else {
return null;
}
}
}到了这里，关于vue table 行改变颜色的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
