el-table 中 row-style的用法

在Element UI的`el-table`组件中，`row-style`是一个特殊的指令，它允许你在渲染每行数据时动态应用CSS样式。这个属性接收一个函数作为值，这个函数接受当前行的原始数据对象作为参数，并返回一个包含CSS样式的对象，或者是字符串。

例如：

<el-table :data="tableData" :row-style="getRowStyle">
  <!-- 表格列... -->
</el-table>

<script>
export default {
  methods: {
    getRowStyle(row) {
      // 根据row的某个值来决定行的样式
      if (row.status === 'active') {
        return { backgroundColor: '#f0f9ee' }; // 如果状态为活跃，则背景色设为浅绿色
      } else {
        return {};
      }
    }
  },
  data() {
    return {
      tableData: [
        { name: '张三', status: 'active' },
        { name: '李四', status: 'inactive' },
        // 更多数据...
      ]
    };
  }
};
</script>

在这个例子中，如果某一行的状态是'active'，那么这一行会有一个淡绿色的背景。如果状态不是'active'，则默认样式不会改变，或者你也可以返回一个空对象`{}`，表示该行不受影响。