element-ui异步加载行政区划树
功能：进入页面，左侧显示行政区划树的顶级目录，单击目录左侧的箭头，则向后端发送请求，获得该级目录的子目录；以此类推；点击目录本身，则向后端发请求和右边的列表进行联动；首先说后台返回的数据构成：ａｊａｘ的列表id-uuid label-名称 ztreeType-（0显示行政区划下的子区划，1显示行政区划下的部门） hasChild-是否有子节点前端树代码：<el-tree:props="defaultProps" //这个很重要，element-ui的树自带node属性，这个属性要和后端返回的数据映射:expand-on-click-node="false":filter-node-method="filterNode":default-expand-all="false"ref="tree"lazy:load="loadNode"node-key="id"highlight-current@node-click="handleNodeClick"></el-tree>
属性：defaultProps:{children:[],label:'label',id:'id',isLeaf:'hasChild'},方法：
//筛选节点filterNode(value,data){if(!value) return true;return data.label.indexOf(value)!==-1;}
//节点单击事件handleNodeClick(data){this.queryParams.deptId = data.id;getList();}
//异步树叶子节点懒加载逻辑loadNode(node,resolve){//此方法是进入页面后自动运行的,两个参数也是默认加载的//一级节点处理if(node.level==0){this.requestTree(resolve);}//其余节点处理if(node.level>=1){this.getIndex(node,resolve);}},
//首次加载一级节点数据函数requestTree(resolve){regionTree({regionCode:370000}).then(response=>{response.data.forEach(item=>{if(item.hasChild=='true'){item.hasChild = false}else{item.hasChild = true}})resolve(response.data)}).catch(err=>{})},
//异步加载叶子节点函数
getIndex(node,resolve){regionTree({regionCode:node.key}).then(res=>{res.data.forEach(item=>{if(item.hasChild=='true'){item.hasChild = false}else{item.hasChild = true}})resolve(res.data);}).catch(err=>{})
},