表格树型结构的处理--树型处理工具函数
/***
* 数组树形结构 转数型结构
* */
export function ArrTree(data) {
var nwearr = data;
let result = [];
if (!Array.isArray(data)) {
return result;
}
data.forEach(item => {
delete item.children;
});
let map = {};
data.forEach(item => {
map[item.id] = item;
});
data.forEach(item => {
let parent = map[item.pid];
if (parent) {
if (item.pid != 0) {
let fffffff = nwearr.find(cc => {
return cc.id == item.pid;
});
if (fffffff != undefined) {
(parent.children || (parent.children = [])).push(item);
}
} else {
(parent.children || (parent.children = [])).push(item);
}
} else {
if (item.pid != 0) {
let fffffff = nwearr.find(cc => {
return cc.id == item.pid;
});
if (fffffff != undefined) {
result.push(item);
}
} else {
result.push(item);
}
}
});
return result;
}
页面
<el-table :row-class-name="tableRowClassName" ref="table" height="75vh" v-loading="crud.loading"
v-watermark="{text:syname,textColor:'rgba(180, 180, 180, 0.3)'}"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
row-key="id"
:data="ArrTree(crud.data)" @select="crud.selectChange" @select-all="crud.selectAllChange"
@selection-change="crud.selectionChangeHandler">```
toggleRowExpansion(isExpansion){
this.toggleRowExpansion_forAll(this.crud.data,isExpansion);
},
toggleRowExpansion_forAll(data,isExpansion){
data.forEach(item=>{
this.$refs.table.toggleRowExpansion(item,isExpansion);
if(item.children != undefined && item.children != null){
this.toggleRowExpansion_forAll(item.children,isExpansion);
}
})
}
