elementuitable多选禁选

对于 Element UI 中的 Table 组件，要实现多选和禁选功能，可以通过以下步骤进行操作：

1. 添加多选列：在 Table 组件中的 Columns 配置项中，增加一列用于显示多选框。可以使用 `<el-table-column>` 组件，并设置 `type` 属性为 "selection"。

<el-table :data="tableData" style="width: 100%">
  <el-table-column type="selection"></el-table-column>
  <!-- 其他列配置项 -->
</el-table>

2. 启用多选功能：在 Table 组件中添加 `selection-change` 事件监听，绑定一个方法用于获取选中的行数据。

<el-table :data="tableData" style="width: 100%" @selection-change="handleSelectionChange">
  <el-table-column type="selection"></el-table-column>
  <!-- 其他列配置项 -->
</el-table>

methods: {
  handleSelectionChange(selection) {
    console.log(selection); // 获取选中的行数据
  }
}

3. 禁选特定行：可以通过在数据源中添加 `disabled` 字段，并在行渲染时判断该字段的值，决定是否禁用多选框。

<el-table :data="tableData" style="width: 100%" @selection-change="handleSelectionChange">
  <el-table-column type="selection"></el-table-column>
  <!-- 其他列配置项 -->
</el-table>

data() {
  return {
    tableData: [
      { name: 'John', age: 20, disabled: false },
      { name: 'Alice', age: 25, disabled: true },
      // 其他数据
    ]
  }
}

<template>
  <el-table-column type="selection" :disabled="scope.row.disabled"></el-table-column>
  <!-- 其他列配置项 -->
</template>

这样就可以实现在 Element UI 的 Table 组件中同时进行多选和禁选功能。