vue.js - el-table的合计行如何自定义单元格内容的样式？

Question

el-table的合计行如何自定义单元格内容的样式？

使用summary-method方法可以自定义合计行的内容，但是我想实现合计行的某一列数据小于0则显示绿色，反之则显示红色，elementUI的文档没有给出自定义样式的方法，百度也搜不到，AI也是答非所问
例如

Answer 1

我自己使用的是动态class和css伪类:nth-child，让指定合计行的列显示不同颜色。
不过拓展性不好，建议用楼上大佬的方法

Answer 2

可以通过js去给统计的那列增加class解决。summary-method返回的columns中有每一列的className。

Answer 3

只是设置颜色的话，可以学习element-plus-table中提到的方法，在summary-method中返回一个VNode，这个相当于设置单元格子元素的内容和样式，并不是直接操作单元格，如果需要操作单元格，需要使用下面代码$nextTick中的方式，使用js原生dom api进行设置

sums.forEach((item, index) => {
  if(parseFloat(item) > 0){
    let el = sums[index] = this.$createElement('span', { style: { color: '#f00' } }, [item])
    this.$nextTick(() => {
      el.elm.parentNode.parentNode.style="background:#ff0;"
    })
  }
})