element ui 选择框多选

element-ui的多选框问题是指当设置多选框的min属性超过1时，无法选中第一项。根据提供的代码，可以看出问题出现在handleSelectionChange方法中的逻辑上。在这个方法中，当勾选项的数量为0时，会直接返回，导致无法选中第一项。

解决这个问题的方法是，在handleSelectionChange方法中，将清除所有勾选项的代码移动到if语句的外部，这样即使勾选项的数量为0，也能够选中第一项。修改后的代码如下：

handleSelectionChange(selection, row) {
  // 清除所有勾选项
  this.$refs.multipleTable.clearSelection()
  // 当表格数据都没有被勾选的时候就返回
  // 主要用于将当前勾选的表格状态清除
  if (selection.length === 0) return
  this.multiple = !e.length
  this.single = e.length !== 1
  this.bill_id = row.id
  this.$refs.multipleTable.toggleRowSelection(row, true)
}

这样修改后，多选框就能够正常选中第一项了。

相关问题

element ui 表单提交多选

对于element-ui的el-table表格复选框，可以通过使用selection-change事件来实现多选和单选的功能。具体的代码实现如下：

<template>
  <el-button type="success" icon="el-icon-first-aid-kit" :disabled="multiple">多选</el-button>
  <el-button type="success" icon="el-icon-first-aid-kit" :disabled="single">单选</el-button>
  <el-table ref="multipleTable" :data="tableData" border @selection-change="handleSelectionChange">
    <el-table-column type="selection" width="55"></el-table-column>
  </el-table>
</template>

在上述代码中，@selection-change="handleSelectionChange"表示当选择发生改变时，会执行名为handleSelectionChange的方法。在该方法中，可以通过获取选中的数据进行相应的处理，如获取选中的多条数据或者获取选中的单条数据。

element-ui table多选CheckBox参数解析

当使用 Element UI 的 table 组件进行多选时，可以在列定义中设置 `type` 属性为 `selection`，这将会在表格中显示出一个复选框列。当用户勾选了其中的某些行时，可以通过 `@selection-change` 事件来获取当前选中的行数据，如下所示：

<el-table
  :data="tableData"
  @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="age"
    label="年龄">
  </el-table-column>
</el-table>

methods: {
  handleSelectionChange(selection) {
    console.log(selection)
  }
}

在 `handleSelectionChange` 方法中，`selection` 参数是一个包含已选择行数据的数组。如果需要获取选中行的索引，可以在 `el-table` 上设置 `row-key` 属性，并在 `selection-change` 事件中通过 `selection.map(item => this.$refs.table.$data.indexOf(item))` 获取。