[{"data":1,"prerenderedAt":7},["ShallowReactive",2],{"example-markdown-content:zh:leaf-expand-button-lazy-loading":3},{"markdown":4,"isPaidExample":5,"isTruncated":5,"charLimit":6},"# 通过叶子节点展开按钮懒加载子节点\n\n## 这个示例构建了什么\n\n这个示例构建了一个从左向右展开、占满高度的树形图，其中混合了一条静态分支和一条高亮的懒加载分支。画布初始时包含一个已经填充完成的白色 `b` 子树，以及一个金色的 `c` 子树；后者的叶子占位节点 `c1`、`c2` 和 `c3` 虽然还没有子节点，但已经显示了展开按钮。\n\n用户可以点击这些占位叶子节点上的内置展开按钮，看到持续一秒的 `Loading...` 覆盖层，然后观察到三个新生成的子节点出现在被展开节点下方。这个示例的重点不是通用的展开或收起行为，而是如何把一个空叶子节点变成一次性懒加载触发器，并在加载后重新执行布局，让新分支稳定地落到正确位置。\n\n## 数据是如何组织的\n\n数据直接在 `initializeGraph()` 中以内联方式组装为一个 `RGJsonData` 对象，其中包含 `rootId: 'a'`、一个扁平的 `nodes` 数组和一个扁平的 `lines` 数组。树的 `b` 侧一开始就被完整定义，而 `c` 侧则包含三个占位叶子节点，这些节点在 `node.data` 中携带了额外元数",true,500,1782615416248]