elementUI 中的table的选择多行数据时使用 Checkbox。实现disable 以及全选

要在 ElementUI 的 table 中实现多行数据选择并使用 Checkbox，可以按照以下步骤进行操作：

1. 首先，确保在你的项目中正确导入了 ElementUI 组件库和样式。

2. 在你的 table 中，给每一行的数据添加一个标识字段，用于判断是否选中。例如，给每一条数据添加一个属性 `selected` 默认值为 `false`。

3. 在 table 的列定义中，使用 Checkbox 组件作为表头的选中框。通过 `@change` 事件监听全选框的变化，并将其值传递给每一行数据的 `selected` 属性。

4. 在每一行的数据中，使用 Checkbox 组件作为选择框。将每一行的 `selected` 属性绑定到 Checkbox 的 `v-model` 上，实现单行选择。

5. 如果需要禁用某些行的选择，可以在每一行数据中添加一个 `disabled` 属性，并将其绑定到 Checkbox 的 `:disabled` 属性上。

下面是一个示例代码：

<template>
  <el-table :data="tableData">
    <el-table-column type="selection" width="55">
      <template slot-scope="scope">
        <el-checkbox @change="handleSelectAll(scope.$event)" :indeterminate="isIndeterminate" v-model="selectAll"></el-checkbox>
      </template>
    </el-table-column>
    <el-table-column prop="name" label="Name"></el-table-column>
    <el-table-column prop="age" label="Age"></el-table-column>
    <el-table-column prop="gender" label="Gender"></el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { name: 'John', age: 20, gender: 'Male', selected: false },
        { name: 'Alice', age: 25, gender: 'Female', selected: false },
        { name: 'Bob', age: 30, gender: 'Male', selected: false }
      ],
      selectAll: false
    };
  },
  computed: {
    isIndeterminate() {
      const selectedCount = this.tableData.filter(item => item.selected).length;
      return selectedCount > 0 && selectedCount < this.tableData.length;
    }
  },
  methods: {
    handleSelectAll(value) {
      this.tableData.forEach(item => {
        item.selected = value;
      });
    }
  }
};
</script>

在上面的示例中，每一行数据都有一个 `selected` 属性，默认为 `false`。全选框使用了 Checkbox 组件，并通过 `@change` 事件监听其变化，将选中状态传递给每一行数据的 `selected` 属性。每一行的选择框也使用 Checkbox 组件，并通过 `v-model` 双向绑定到每一行数据的 `selected` 属性上。你还可以给某些行添加 `disabled` 属性，将其绑定到 Checkbox 的 `:disabled` 上，实现禁用选择功能。

这样，你就可以使用 Checkbox 在 ElementUI 的 table 中实现多行数据选择、禁用和全选的功能了。