el-table可以选中 但是在某些条件下禁止选中

el-table可以选中 但是在某些条件下禁止选中

在Element UI中，可以通过覆盖默认的行为来实现这样的功能，即在某些条件下禁止选中表格中的行。具体来说，可以通过监听el-table的row-click事件或者覆盖选择框的行为来实现这一点。

以下是一个示例，展示了如何在一个el-table中允许用户选择行，但在某些特定条件下禁用选择功能：

示例代码：

<template>
  <el-table
    ref="multipleTable"
    :data="tableData"
    style="width: 100%"
    @row-click="onRowClick"
    @selection-change="handleSelectionChange">
    <el-table-column
      type="selection"
      width="55">
    </el-table-column>
    <el-table-column
      prop="name"
      label="姓名">
    </el-table-column>
    <el-table-column
      prop="date"
      label="日期">
    </el-table-column>
    <!-- 更多列... -->
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { name: 'Alice', date: '2016-05-02', selectable: true },
        { name: 'Bob', date: '2016-05-03', selectable: false }, // 假设这一行不允许选中
        // 更多数据...
      ],
      selectedRows: []
    };
  },
  methods: {
    handleSelectionChange(val) {
      this.selectedRows = val;
    },
    onRowClick(row, event, column) {
      if (!row.selectable) {
        this.$refs.multipleTable.clearSelection();
        this.$refs.multipleTable.toggleRowSelection(row, false);
      }
    }
  }
};
</script>

解释：

1. onRowClick 方法监听了每一行的点击事件。当点击某一行时，会检查该行的selectable属性是否为false。如果是false，则阻止行的选择。
2. handleSelectionChange 方法用于处理选中行变化的情况，这里可以添加你自己的逻辑。
3. selectable 属性是一个布尔值，用来标识该行是否允许被选中。

这样，通过在数据中增加一个selectable字段，并根据此字段决定是否允许选中，就能实现在某些条件下禁止选中的功能。