el-table表格多選框

element-ui提供的table組件是支持多選框的，只要稍加一些配置即可。

<!-- 在table中添加selection-change的處理函數，回調函數就可以拿到選中的數組 -->
<el-table
  :data="tableData"
  border
  style="width: 100%"
  ref="checkTable"
  @selection-change="handleSelectionChange">
  <!-- 只需在表格里多加一列.設置type="selection"就可以 -->
  <el-table-column
    type="selection"
    width="55"
    :selectable="handleDisable">
  </el-table-column>
</el-table>

handleSelectionChange (selection) {
  console.log(selection)
},
handleDisable(row, index) {
  return false // 這里可以用條件判斷是否禁用
}

另外如果是使用樹表的話，多選要特別注意會有一些額外的問題。

 

"魚沒有水會死，水沒有魚卻會更清澈。"