ElementUI级联选择器动态加载

官网Demo：

这是官网的Demo，我们要做的就是把

 Array.from({ length: level + 1 })
                .map(item => ({}）

数据处理一下，换成我们的接口数据。

通过解构赋值替换参数，需要注意的是，leaf是一个booler值，为true时不显示子节点，反之显示。其他参数直接赋值即可。

level  代表级数。默认为0，会自动累加

具体的Demo代码：

var vm = new Vue({
        el: "#apps",
        data() {
            return {
                props: {
                    lazy: true,
                    lazyLoad(node, resolve) {
                        const { level } = node;
                        console.log(node)
                        setTimeout(() => {
                            // 第一級
                            if (node.level == 0) {
                                // Ajax請求數據，填充選擇框
                                asiox.get(url).then((response) => {
                                    const nodes = response.data.map((item, index) => ({
                                            value: item.id,
                                            lable: item.nodeName,
                                            leaf:node.level >= 2
                                    }));
                                    resolve(nodes);         
                                })
                            }
                            // 第二級
                            if(node.level == 1){
                                // Ajax請求數據，填充選擇框，傳遞上一級參數
                                asiox.get(url+node.value).then((response) => {
                                    const nodes = response.data.map((item, index) => ({
                                            value: item.id,
                                            lable: item.nodeName,
                                            leaf:node.level >= 2
                                    }));
                                    resolve(nodes);         
                                })
                            }
                    
                        }, 100);
                    }
                }
            };
        },
        computed: {

        },
        mounted() {

        },
        methods: {
            handleChange(value) {

                console.log(value);
            
            },
        }


    })

  "props" style="width:100%"
                             @change="handleChange">
                

选择一节后node的输出