el-table,el-table-column,selection，获取多选选中的数据

最新推荐文章于 2025-07-04 22:30:09 发布

原创最新推荐文章于 2025-07-04 22:30:09 发布 · 5.9k 阅读

7 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript #elementui

vue2 同时被 2 个专栏收录

63 篇文章

订阅专栏

element ui

22 篇文章

订阅专栏

本文介绍了如何在Vue中使用Element UI的el-table组件实现表格的多选功能，并展示了如何监听selection-change事件来获取并处理选中的代码。方法部分详细讲解了如何清空已选代码并更新选中状态。

 <el-table @selection-change="handleSelectCodeForTicket" :data="tableData" :height="tableHeight" >
          <el-table-column
      type="selection"
      width="50">
    </el-table-column>
 </el-table>

  Selection: [],
methods: {
    // 选择
      handleSelectCodeForTicket (val) {
        console.log(val)
      this.Selection = []
      val.forEach(v => {
        this.Selection.push(v.code)
      })
    }
}