loading = false; let selectIds = this.getChecked(menuList); //递归获取到勾选的所有id console.log("递归获取的勾选值", selectIds); // 判断是否是末级 let { setLeaf } = leafUtils(); let newMenuList = setLeaf(menuList); this.treeData = newMenuList; console.log("自己构造出的树木",...
在Vue中使用el-tree组件实现懒加载和节点回显,可以按照以下步骤进行: 1. 理解vue el-tree懒加载机制 懒加载是一种数据加载策略,它只在用户需要时才加载数据,这样可以减少初始加载时间和内存消耗。在el-tree组件中,懒加载通过load方法实现,每次用户展开节点时,都会调用这个方法以获取子节点数据。 2. 实现懒加载数据...
asyncgetAreaConnectList() {letres =awaitgetAreaConnectList(this.chosen);if(res.code===200) {this.treeDataAll= res.data|| []; }else{this.$message.error("获取区域关联数据失败", res.code); }letarr = [];letlevel =0;letregionStr ="";this.resolveData(this.treeDataAll, arr, level, reg...
问题场景 树形节点默认是全部折叠的。展开节点A,再把它折叠。然后给节点B新增子节点,新增成功后刷新树,却发现节点A是展开的。 原因分析 树刷新后全部节点都默认是折叠的,除非defaultExpandedKeys数组中有数据(这些节点数据是展开的)。 因此,只需要在折叠节点A时,在defaultExpandedKeys数组中移除掉节点A及其子节点数据...
由A页面链接到B页面,B页面的tree,默认选中第一个节点,并点击第一个节点,来加载右边的datagrid 在B页面的datagrid某行上,操作列,点击编辑,弹出窗口加载C页面 C页面修改树的该节点信息,点保存 保存成功,刷新左边树结构reload,并选中刚选中的节点,就是回显 在A页面,要打开B页面的方法里传递参数,标志B页面是不是第...
现实场景:可以在通过node取到每一层的id,根据这个id调用接口得到数据。再通过resolve进行回显,回显的数据为这个id的子节点 二次封装 场景:由于用到树形控件的地方很多,而且需要显示的数据都不一样,所以将树形控件再封装一层,然后根据外部组件传来的不同参数,进行树形图的不同显示。
if (res.code === 200) { this.treeDataAll = res.data || [];} else { this.$message.error("获取区域关联数据失败", res.code);} let arr = [];let level = 0;let regionStr = "";this.resolveData(this.treeDataAll, arr, level, regionStr);this.defaultCheckedKeys = arr || [];},
else{this.$message.error("授权失败");}}) console.log(newArr) this.roleDia = false }, 问题2:回显有父级id,默认选中父级下所有子级 // 组授权 handleAuth(id){ //获取回显的id getRoleId(id).then(res=>{ let that = this if (res.data.lists) { ...