请你扮演一个高级前端，告诉我el-table中单元格根据条件变色

好的，针对你的问题，我可以提供以下方案：

1. 在 el-table 中使用 slot-scope 对每个单元格进行自定义渲染，根据条件设置相应的 class。
例如：

<el-table :data="tableData">
  <el-table-column label="姓名" prop="name">
    <template slot-scope="{ row }">
      <div :class="{ 'red-text': row.age > 30 }">{{ row.name }}</div>
    </template>
  </el-table-column>
  <el-table-column label="年龄" prop="age">
    <template slot-scope="{ row }">
      <div :class="{ 'red-text': row.age > 30 }">{{ row.age }}</div>
    </template>
  </el-table-column>
</el-table>

<style>
.red-text {
  color: red;
}
</style>

2. 使用 el-table-column 中的 formatter 属性，设置单元格的渲染函数，根据条件返回相应的 html 字符串。
例如：

<el-table :data="tableData">
  <el-table-column label="姓名" prop="name"></el-table-column>
  <el-table-column label="年龄" prop="age" :formatter="formatAge"></el-table-column>
</el-table>

<script>
export default {
  methods: {
    formatAge(row, column) {
      if (row.age > 30) {
        return `<span style="color: red;">${row.age}</span>`
      } else {
        return row.age
      }
    }
  }
}
</script>

以上是两种常见的解决方案，你可以根据自己的实际情况选择其中一种来实现。