elementui 合计行修改指定单元格样式

如果你的表格使用的是 ElementUI 的 `<el-table>` 组件，你可以通过自定义表格的 slot 来实现合计行修改指定单元格样式的需求。

具体步骤如下：

1. 首先，在表格中添加一个 `show-summary` 属性，将其值设置为 `true`，以开启合计行的显示功能。

<el-table :data="tableData" show-summary>
  <!-- 表格列定义 -->
</el-table>

2. 接着，为表格添加一个 `::summary-method` 属性，该属性值为一个函数，用于自定义合计行的内容。

<el-table :data="tableData" show-summary :summary-method="getSummary">
  <!-- 表格列定义 -->
</el-table>

3. 在 `getSummary` 函数中，你可以通过计算合计行所需的数据，并返回一个包含合计行内容的对象。在这个对象中，你可以为需要修改样式的单元格设置一个 `class` 属性，并自定义该单元格的样式。

methods: {
  getSummary({ columns, data }) {
    const sums = []
    columns.forEach((column, index) => {
      if (index === 0) {
        sums[index] = '合计'
        return
      }
      const values = data.map(item => Number(item[column.property]))
      const sum = values.reduce((prev, curr) => {
        const value = Number(curr)
        if (!isNaN(value)) {
          return prev + curr
        } else {
          return prev
        }
      }, 0)
      sums[index] = `¥ ${sum.toFixed(2)}`
      if (column.property === 'xxx') { // 修改指定单元格样式
        sums[index] = {
          class: 'highlight',
          text: `¥ ${sum.toFixed(2)}`
        }
      }
    })
    return sums
  }
}

4. 最后，你只需要在样式中定义 `.highlight` 类，来自定义需要修改的单元格样式即可。

.highlight {
  color: red;
  font-weight: bold;
}