element ui table表格根据单元格的值动态设置背景色 |
您所在的位置：网站首页 › 根据数值设置单元格颜色 › element ui table表格根据单元格的值动态设置背景色 |
element ui table表格根据单元格的值动态设置背景色
|
效果图：
代码： export default { name: "demo", data() { return { tableData1: [{ date: '1', name: '1025', address: '上海市普陀区金沙江路 1518 弄' }, { date: '2', name: '952', address: '上海市普陀区金沙江路 1517 弄' }, { date: '3', name: '1425', address: '上海市普陀区金沙江路 1519 弄' }, { date: '4', name: '3621', address: '上海市普陀区金沙江路 1516 弄' }, { date: '5', name: '857', address: '上海市普陀区金沙江路 1516 弄' }, { date: '6', name: '5151', address: '上海市普陀区金沙江路 1516 弄' }, { date: '7', name: '2234', address: '上海市普陀区金沙江路 1516 弄' }] } }, watch: { }, created() {}, methods: { //设置单个单元格样式 行下标：rowIndex 列下标：columnIndex cellStyle({ row, column, rowIndex, columnIndex }) { if (columnIndex == 1) { if (row.name == '1425') { return 'background-color:red' } else if (parseInt(row.name) > 1000) { return 'background-color: green' } else { return 'background-color: yellow' } } }, } };
|
【本文地址】
今日新闻 |
推荐新闻 |