使用el-table 如何根据每行内容显示不同的样式区分

使用 `el-table` 标签，可以使用 `slot-scope` 属性来自定义每个单元格的样式。你可以在 `el-table-column` 标签内添加一个 `template` 标签，然后使用 `slot-scope` 属性来访问当前行的数据，从而根据需要将样式应用于单元格。以下是一个简单的示例：

<template>
  <el-table :data="tableData">
    <el-table-column label="姓名" prop="name">
      <template slot-scope="scope">
        <div :class="{ 'text-bold': scope.row.score > 90 }">{{ scope.row.name }}</div>
      </template>
    </el-table-column>
    <el-table-column label="分数" prop="score"></el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { name: '张三', score: 80 },
        { name: '李四', score: 95 },
        { name: '王五', score: 70 },
      ],
    };
  },
};
</script>

<style>
.text-bold {
  font-weight: bold;
}
</style>

在上面的示例中，我们使用 `:class` 绑定了一个对象，该对象的 `text-bold` 属性将在当前行的分数大于 90 时被设置为 `true`，从而将加粗样式应用于该单元格的内容。你可以根据你的需求修改 `:class` 绑定的逻辑来应用任何样式。