element UI table表格的多选框 如何根据条件隐藏显示

在Element UI的Table组件中，如果你想根据某个条件来动态地隐藏或显示多选框，你可以使用selection的disabled属性来控制。

以下是一个简单的例子，演示如何根据数据行的某个属性来禁用多选框：

<template>
  <el-table
    :data="tableData"
    style="width: 100%"
    @selection-change="handleSelectionChange">
    <el-table-column
      type="selection"
      width="55">
      <template slot-scope="scope">
        <el-checkbox
          :disabled="scope.row.disableSelection"
          v-model="scope.row.checked">
        </el-checkbox>
      </template>
    </el-table-column>
    <!-- 其他列 -->
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [
        { id: 1, disableSelection: true, checked: false },
        { id: 2, disableSelection: false, checked: false },
        // 更多数据...
      ]
    };
  },
  methods: {
    handleSelectionChange(selection) {
      // 处理选中项
    },
  },
};
</script>

在这个例子中，我们使用了el-table-column的template插槽来自定义多选列的内容。通过scope.row.disableSelection来决定是否禁用当前行的多选框。如果disableSelection是true，多选框会被禁用，反之则可以正常选择。

你可以根据实际的业务逻辑来动态修改tableData中每个对象的disableSelection属性，以控制多选框的禁用状态。