:cell-style属性
//html
<el-table
empty-text="暂无数据"
:data="datalist.table"
:max-height="height"
row-key="id"
border
:cell-style="cellStyle"
>
<el-table>
//js
//动态设置单元格颜色
const cellStyle = ({ row, column, rowIndex, columnIndex }) => {
if (column.property == "alarmLevel") {
// console.log(row);
if (row.alarmLevel == 1) {
return { backgroundColor: "rgba(80,227,194,0.4)", color: "#333333" };
} else if (row.alarmLevel == 2) {
return { backgroundColor: "rgba(247,220,111,0.4)", color: "#333333" };
} else if (row.alarmLevel == 3) {
return { backgroundColor: "rgba(234,149,24,0.4)", color: "#333333" };
} else if (row.alarmLevel == 4) {
return { backgroundColor: "rgba(216,30,6,0.4)", color: "#333333" };
}
}
};
上一篇文章,
vue3+echarts:Vue中使用echarts从后端获取数据并赋值显示_vue3中使用echars绘制折线图,获取后台数据-CSDN博客文章浏览阅读845次,点赞4次,收藏5次。vue3+echarts:Vue中使用echarts从后端获取数据并赋值显示,echarts异步加载,获取后端数据_vue3中使用echars绘制折线图,获取后台数据https://blog.csdn.net/weixin_43928112/article/details/136042118?spm=1001.2014.3001.5501