el-table如何绑定:row-class-name="tableRowClassName"设置某一行数据颜色

在 `el-table` 组件中，可以通过 `row-class-name` 属性来动态设置每一行数据的样式。具体操作如下：

1. 在 `data` 中定义 `tableRowClassName` 方法，该方法接收一个参数 `row`，代表当前行的数据，返回一个字符串，表示该行的 CSS 类名。

   data() {
     return {
       tableData: [
         { name: '张三', age: 18 },
         { name: '李四', age: 20 },
         { name: '王五', age: 22 }
       ]
     }
   },
   methods: {
     tableRowClassName({ row }) {
       if (row.age < 20) {
         return 'table-row-red';
       } else if (row.age > 20) {
         return 'table-row-green';
       }
     }
   }

2. 在 `el-table` 组件中，绑定 `row-class-name` 属性，并将其值设置为 `tableRowClassName` 方法名。

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

3. 在 CSS 中，定义 `.table-row-red` 和 `.table-row-green` 类的样式，用于设置行的颜色。

   .table-row-red {
     background-color: pink;
   }

   .table-row-green {
     background-color: lightgreen;
   }

这样，就可以根据每一行数据的不同属性值，动态地设置每一行的样式了。