el-table+tree+懒加载实现添加下级、编辑、删除更新页面

在新增下级的时候怎么拿到懒加载的数据 百度的方法都试了 不知道哪里出了问题,请教各位前端铅笔们

参考以下,同学
(1) ElementUI 树形表格懒加载-新增修改删除等操作 https://blog.csdn.net/Yzt_199626/article/details/117171822
(2) el-table异步树形表格与数据懒加载 - 潇湘羽西 https://www.cnblogs.com/steamed-twisted-roll/p/16022781.html
(3) el-table懒加载实现添加下级、编辑、删除更新页面 https://blog.csdn.net/weixin_46151381/article/details/121697264

如果数据不多且网速较好的情况下,可以预加载缓存所有数据进行逐条显示,
如果数据较多的情况下对请求的数据划分,即多次少量的请求,这分两种情况,如果用的是自己的拟数据库,可以添加‘组’即多少条一组,通过路由传参换组显示,如用的后端数据库则先用postman测试一下上述方法是否可行,不行的话限则在请求数据时进行处理,axios有一个超时处理(应该是叫timeout)。可以通过这个进行懒加载

https://element.eleme.cn/#/zh-CN/component/tree
官方文档都有的,结合load、rendContent方法可以做到。

<el-tree
            :props="props"
            lazy
            show-checkbox
            :load="loadNode"
            :expand-on-click-node="false"
            :render-content="renderContent"
        >
        </el-tree>

// 数据初始化
            props: {
                // label: 'name',
                // children: 'zones',
                isLeaf: 'leaf'
            },
            tree: [
                {
                    id: 1,
                    label: '一级 1',
                    children: []
                }
            ],
            id: 2


 loadNode(node, resolve) {
            console.log(node)
            if (node.level === 0) {
                return resolve(this.tree);
            }
            return resolve(node.childNodes);
        },
        append(data) {
            this.id++;
            const newChild = { id: this.id, label: this.id, children: [] };
            if (!data.children) {
                this.$set(data, 'children', []);
            }
            data.children.push(newChild);
        },
        remove(node, data) {
            const parent = node.parent;
            const children = parent.data.children || parent.data;
            const index = children.findIndex(d => d.id === data.id);
            children.splice(index, 1);
        },
        renderContent(h, { node, data, store }) {
            return (
                <span class="custom-tree-node">
                    <span>{node.label}</span>
                    <span>
                        <el-button size="mini" type="text" on-click={() => this.append(data)}>Append</el-button>
                        <el-button size="mini" type="text" on-click={() => this.remove(node, data)}>Delete</el-button>
                    </span>
                </span>);
        }