這里使用到樹形控件的懶加載功能-直接上代碼

<el-tree
   ref="selecteltree"
   class="main-select-el-tree"
   node-key="id"
   highlight-current
   :props="props"
   :load="loadNode1"
   lazy
   @node-click="handleNodeClick"
></el-tree>


export default {
    components: { VideoPlayer, RtmpPlayer },
    name: "stock", // 要自動注冊init事件，必須等于文件名!
    data() {
        return {
            // 自定義名
            props: {
               label: "name", // 自定義顯示
               children: "zones",
               isLeaf: "leaf",
            },
    },
    methods: {
        loadNode1(node, resolve) {
            // node:當前點擊項的所有數據（包括返回數據） // resolve:渲染數據到當前項子節點

            // 當前第一層: 自動調用接口拿到第一層的數據
            if (node.level === 0) {
                // 換成你需要的請求接口
                api.getCountByDateTwo("001", "001").then((res) => {
                    if (res.data.code == 0) {
                        let data = res.data.data.value;
                        console.log(data);
                        // 這個是要的
                        return resolve(data);
                    }
                });
            }
            // 判斷當前節點是否有下一層: 判斷條件看需求自定義
            if (node.data && node.data.nodeType == "org") {
                api.getCountByDateTwo(node.data.id, "001;1").then((res) => {
                    if (res.data.code == 0) {
                        let data = res.data.data.value;
                        console.log(data);
                        // 將子節點數據給到當前節點: 數據結構為數組套對象: [{},{}]
                        return resolve(data);
                    }
                });
            } else if (node.data && node.data.nodeType == "dev") {
                api.getCountByDateTwo(node.data.id, "001;00;1").then((res) => {
                    if (res.data.code == 0) {
                        let data = res.data.data.value;
                        let list = [];
                        // 也可以直接改
                        data.forEach((el) => {
                            list.push({
                                name: el.name,
                                id: el.id,
                                nodeType: el.nodeType,
                                leaf: true, // 決定是否有子節點
                            });
                        });
                        console.log(list);
                        return resolve(list);
                    }
                });
            }
        },
        
        // 當前項點擊觸發: e為當前數據
        handleNodeClick(e) {
            console.log(e);
            // this.$refs.selectTree.blur() // 收起tree
        },
};

以上就是一個簡單的通過接口來獲取下層數據-并已樹形展示：elelment官方文檔上的懶加載就是這個

還有一種是帶有勾選框的: 需要改變源代碼來實現：后面有空在搞吧