1.开发环境vue2.电脑系统windows10专业版3.在使用ant-design-vue开发过程中，我们在使用树选择的时候，由于数据量大，一般都是点击父节点请求子节点数据，分享一下下面的方法。4.废话少说，直接上传代码：maxHeight:'400px',overflow:'auto'}":tree-data="ruleForm.StoreCategoryobj.options"placeholder="Pleaseselect":load-data="StoreCategoryload"//异步加载数据的方法@focus="StoreCategoryobjfocus"//获取焦点的方法：showSearch="true"//显示搜索框/>StoreCategoryobj:{value2:"",options:[{id:1,pId:0,value:"1",title:"展开加载"},{id:2,pId:0,value:"2",title:"展开加载"},{id:3,pId:0,value:"3",title:"树节点“,isLeaf:true},],id:"",},5.在methods中添加如下代码：//获取焦点时，将绑定值赋给后端StoreCategoryobjfocus(){console.log("获取焦点事件");treetable({pid:this.account.rootTypeId,storeId:this.account.storeId,}).then((res)=>{console.log("我是一个树结构界面的表");console.log(res);console.log(this.$Cmethods.treelist(res.result));this.ruleForm.StoreCategoryobj.options=this.$Cmethods.treelist(res.result);//this.ruleForm.StoreCategoryobj.options=this.$Cmethods.treelist(//res.result//);//console.log(this.$Cmethods.treelist(res.result));//this.ruleForm.StoreCategoryobj.options=this.$Cmethods.treelist(//res.result//);});//点击父节点时，请求子节点的数据StoreCategoryload(treeNode){console.log(treeNode);console.log(treeNode.dataRef);returntreetable({pid:treeNode.dataRef.id,storeId:this.account.storeId,}).then((res)=>{console.log("我是树形结构的表界面");console.log(res);console.log(res.result)//将获取的子节点数据赋值给父节点中的children});},6.全局树过滤方法：functiontreelist(tree,arr=[]){if(!tree.length)return[]for(letitemoftree){//遍历数组，然后过滤数据//如果数据类型不为0，则跳出本次循环//if(item.type!==0)continue//如果满足条件，用一个新节点替换它，然后清除chilren//console.log(item[name]);item.label=item.name;item.isLeaf=!item.isParent;item.title=item.name;item.value=item.id;//letnode={...item,children:[]}letnode={...item,children:[]}//然后添加到新数组arr.push(node)//如果有子节点，调用递归函数，放空将数组传给下一个函数//利用引用数据类型的特性，实现浅拷贝//递归函数过滤时，会改变空数组数据，从而实现层级结构过滤if(item.children&&item.children.length){filterTree(item.children,node.children)}}returnarr}7、效果如下：8、本期分享到此结束。希望对您有所帮助。让我们携手共进，勇攀高峰。
