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 // 这里可以用条件判断是否禁用
}

另外如果是使用树表的话,多选要特别注意会有一些额外的问题。

 

"鱼没有水会死,水没有鱼却会更清澈。"


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM