element table多选表格_element-ui 树形表格多选

如题element-ui 2.13.2版本支持树形结构tabel，多层级折叠显示

但是没有多选 + 树形tabel， 业务需求的情况下必须要实现，操作勾选数据编辑

这里我们可以用两个事件来实现：

@select：用户勾选某行触发事件，第一个参数selection：所有选中的数据， 第二参数row：勾选的这行数据)

@select-all ： 表头的全选、反选触发事件，只有一个参数selection：所有选中的数据

1、多选的处理函数(文档实例)：

toggleSelection(rows) {if(rows) {

rows.forEach(row=>{

// toggleRowSelection有两个参数，第一个是每个选中数据，第二个是点击勾选的这行是否选中，树形结构需要，不然子集选中，本身不给选中this.$refs.multipleTable.toggleRowSelection(row, true);

});

}else{this.$refs.multipleTable.clearSelection();

}

},

2、现在再来处理多选和单选，调用 toggleSelection 即可

因为树形结构的数据结构不符合选中数据格式，因此需要进行过滤处理

//采用普通表格，然后进行样式和交互处理

:data="tableData"ref="multipleTable":row-class-n