Vue中el-table修改单独列的字体颜色、样式，用cell-style写函数

在Vue中，你可以使用cell-style属性来修改el-table中特定列的字体颜色和样式。cell-style接受一个函数，该函数会传入一个参数（对象），包含当前行数据和列信息，并返回一个样式对象。

以下是一个简单的例子，展示如何为el-table的特定列设置字体颜色：

<template>
  <el-table :data="tableData" :cell-style="cellStyle">
    <el-table-column prop="date" label="日期" width="180"></el-table-column>
    <el-table-column prop="name" label="姓名" width="180"></el-table-column>
    <el-table-column prop="score" label="分数" width="180" :cell-style="scoreCellStyle"></el-table-column>
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [
        { date: '2016-05-02', name: '张三', score: 60 },
        { date: '2016-05-04', name: '李四', score: 92 },
        { date: '2016-05-01', name: '王五', score: 70 },
        { date: '2016-05-03', name: '赵六', score: 80 }
      ]
    };
  },
  methods: {
    cellStyle({ row, column, rowIndex, columnIndex }) {
      // 根据需要设置默认样式
      return 'color: black;';
    },
    scoreCellStyle({ row, column, rowIndex, columnIndex }) {
      // 针对分数列，根据数值设置不同的颜色
      if (row.score < 60) {
        return 'color: red;';
      } else if (row.score >= 60 && row.score < 90) {
        return 'color: orange;';
      } else {
        return 'color: green;';
      }
    }
  }
};
</script>

在这个例子中，scoreCellStyle方法会根据分数值设置不同的颜色。你也可以在cellStyle方法中添加更多的条件判断来设置不同的样式。记住，样式字符串应遵循CSS语法。