el-tree loadNode懒加载
不能懒鸭 人气:0需要 lazy、 load 两个属性一起用
<el-tree :data="treeData" :props="defaultProps" :load="loadNode" @node-click="handleNodeClick" lazy> </el-tree>
data() { return { treeDataList: [], defaultProps: { id: 'id', label: 'name', children: 'children', parentId:'parentId', isLeaf: false,// 指定节点 是否为叶子节点,仅在指定了 lazy 属性的情况下生效 }, } },
loadNode(node, resolve) { let that = this; if (node.level === 0) { that.getFatherData(resolve);//获取顶级节点数据 } if (node.level >= 1) { this.getChildrenData(node.data.id, resolve);//异步获取子节点数据 return resolve([]); // 防止在该节点没有子节点时一直转圈 } },
获取顶级节点数据:
getFatherData(resolve) { let options = { url: '', data: { parentId: 0 } } let res = await $.fn.commonPlugin.commonAjaxRequest(options) if(res.flag){ let data = res.data; data.forEach(item => { item={...item,isLeaf:true} }); resolve(data) } },
获取子节点数据:
getChildrenData(parentId, resolve) { let options = { url: '', data: { parentId } } let res = await $.fn.commonPlugin.commonAjaxRequest(options) if(res.flag){ let data = res.data; data.forEach(item => { item={...item,isLeaf:false} }); resolve(data) } },
加载全部内容