element-ui的树型结构图,半选状态数据给后台后,返回数据带有半选父节点的剔除展示

// html
<h2 class="text-gray">功能权限</h2>
<el-tree
:data="permissionList"
:props="defaultProps"
show-checkbox
node-key="permissionId"
default-expand-all
ref="tree_permissions"
@check="change_permission"
v-if="current_roleId"
></el-tree>


//js 只展示返回数据到渲染的半选数据的父节点的剔除

async find_function_permission_by_roleId(){ this.isLoading = true; try { const res = await this.$http.get("scPermission/findScPermissionByRoleId/" + this.current_roleId); this.selectedPermissionsIds = res.data.data; // 将只有部分选择子节点的父节点剔除 let arr =[]; let arrLength = 0; arr = this.selectedPermissionsIds; arrLength = arr.length; let array:any = []; function fun(value:any,data:any,arr:any) { for( let i = 0;i < data.length;i++){ let mod = data[i]; if(mod.permissionId == value) { if(mod.children.length == 0){ arr.push(mod.permissionId); return true } return true }else { if(mod.children.length != 0) { fun(value, mod.children, arr); } } } return true } for(let n = 0;n < arrLength;n++) { fun(arr[n],this.permissionList,array); } this.selectedPermissionsIds = array; let tree_permissions = this.$refs.tree_permissions as Tree; tree_permissions.setCheckedKeys(this.selectedPermissionsIds); // 数据加载完之后,修改成行内样式 setTimeout(()=>{ this.$nextTick(()=>{ this.treeChildInline(); }); },50); } catch (e) { this.$httpErrorHandle(this, e); }finally { this.isLoading = false; } },

  

原文地址:https://www.cnblogs.com/holy-amy/p/10868915.html