【el-table中tree树形结构自定义下拉框】懒加载自定义节点

1、系统要求

因数据量巨大（十万条数据），为避免前端页面加载卡死，现将下拉节点置为点击查询后端接口进行拼接子节点数据（懒加载）。
生产环境已经出现页面卡死情况

2、官方示例

官方示例代码（表示很无奈）
地址：https://element.eleme.cn/#/zh-CN/component/tree

<el-tree
  :props="props"
  :load="loadNode"
  lazy
  show-checkbox>
</el-tree>

<script>
  export default {
    data() {
      return {
        props: {
          label: 'name',
          children: 'zones',
          isLeaf: 'leaf'
        },
      };
    },
    methods: {
      loadNode(node, resolve) {
        if (node.level === 0) {
          return resolve([{ name: 'region' }]);
        }
        if (node.level > 1) return resolve([]);

        setTimeout(() => {
          const data = [{
            name: 'leaf',
            leaf: true
          }, {
            name: 'zone'
          }];

          resolve(data);
        }, 500);
      }
    }
  };
</script>

3、业务代码

优化后代码块

<template>
	<div>
		<el-table border lazy 
		v-if="refreshTable" 
		:data="menuList" 
		:load="localTreeLoad" 
		row-key="orgCodeId"
		:default-expand-all="isExpandAll" 
		:tree-props="{children:'children',hasChildren:'hasChildren'}">
			<el-table-column prop="name" label="姓名"></el-table-column>
		</el-table>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				//菜单表格集合
				menuList: [],
				//是否全部展开，默认折叠
				isExpandAll: false,
				//重新渲染表格状态
				refreshTable: true,
				//查询参数
				queryParams: {
					//查询下个节点时传入的参数
					parentId: undefined
				}
			};
		},
		created() {
			this.getList()
		}
		methods: {
			
			getList(){
				//调用js中查询方法 传入参数
				methods(this.queryParams).then(res =>){
					this.menuList = res.data
					this.menuList.forEach(item =>{
						item.children = null
						item.hasChildren = true
					})
				}
			},
			
			loadNode(tree, treeNode,resolve) {
				//查询节点以下
					const params ={
						name : tree.name
					}
					methods(params).then(res =>){
						const childrenList = res.data
						childrenList.forEach(item =>{
							item.children = null
							item.hasChildren = true
						})
						setTimeout(()=>{resolve(childrenList)},1000);
				
			}
		}
	};
</script>