element-ui 级联选择器cascader动态加载的问题

前段时间项目里有一个树状单位结构的需求，第一反应就是用elementui里的cascader 级联选择器来做。

本来以为是通过接口直接获取到所有单位树后配置一下就可以了，看了需求文档后发现原来是要通过动态加载的方式来获取。

需求：
1.进入页面之后根据当前的单位Id调用第一个接口来获取第一级的单位，并默认展示。
2.如果当前单位有下级单位则显示箭头，点击调用第二个接口获取下级单位。

很快啊，看着elementui官方文档，写了一个简单的demo，如下：

<template>
    <div class="main">
        <el-cascader :props="props"></el-cascader>
    </div>
</template>
<script>
export default {
   
    data(){
   
        return {
   
            placeholder:"",
            defaultName:"",
            props:{
   
                label:'text',
                value:'id',
                lazy: true,
                lazyLoad:(node, resolve) =>{
     
                    if(node.level == 0 ){
   
                        this.queryTree(node, resolve)
                    }else {
   
                        this.queryMoreTree(node, resolve)
                    }
                },
            }
        }
    },
    methods:{
   
        //获取第一级单位
        queryTree(node, resolve){
   
            setTimeout(() => {
   
                let res = [{
   id:"1",text:"北京",hasChildren:true}];
                res.forEach(item => {
   
                    return {
   
                        value:item.id,
                        label:item.text,
                        leaf:item.leaf
                    }
                })
                console.log(res)

                resolve(res)
            }, 500);

        },
        //获取下级单位
        queryMoreTree(node, resolve){
   
            setTimeout(() => {
   
                let<