Tree 树
用于展示层级数据，支持选中、展开、多选、懒加载与节点拖拽。
基础用法
层级树
点击展开按钮显示 / 收起子节点，点击节点文本选中该节点。
受控展开与选中
初始展开与选中
expanded 控制展开节点，selected 控制选中节点。
多选
可多选（checkable）
禁用节点
禁用节点
懒加载
懒加载（展开时异步回填子节点）
点击「目录 A」前的展开箭头触发加载
设置 lazy 后，无 children 且未标记 isLeaf / loaded 的节点视为「未加载」：点击展开箭头派发 oas-load（detail: { key }）并调用 load 属性回调，由宿主回填子节点后重设 data 属性；加载期间展开箭头位置显示 loading 占位，回填完成后自动展开并收起占位。标记 isLeaf: true 的节点不显示展开箭头。
节点拖拽
可拖拽（拖动换序 / 换父）
拖拽节点到目标行上 / 下 / 中部，分别插入其前 / 后 / 子
设置 draggable 后可拖拽节点换序或换父：拖到目标行上半区插入其前（before）、下半区插入其后（after）、中部且目标可展开时移入其下（inner），拖拽过程有插入线与高亮反馈；松手派发 oas-node-drop（detail: { dragKey, dropKey, position }），由宿主更新数据后重设 data 属性。拖到树空白处视为移入根（dropKey 为空字符串、position: 'inner'）。
大数据量（虚拟滚动）
万级节点虚拟滚动
设置 height 开启虚拟化（搭配 row-height 定高）：树复用 oas-virtual-list 只渲染可见窗口内的节点，展开状态保存在 expanded 属性中，滚动与重渲染均不丢失。
事件
选中与勾选事件
选中：— · 勾选：—
API
属性
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
checkable | 是否显示复选框 | boolean | — |
checked | 勾选节点 key 集合（逗号分隔） | string | — |
data | 节点数据 [{ key, label, children?, disabled?, isLeaf?, loaded? }]，JSON 字符串 | TreeNode[] | string | [] |
draggable | 节点可拖拽换序 / 换父，落点显示插入线 / 高亮，松手派发 oas-node-drop | boolean | — |
expanded | 展开节点 key 集合（逗号分隔） | string | — |
height | 虚拟滚动视口高度（px）；设置后开启大数据量虚拟化渲染 | string | 360 |
lazy | 懒加载：无 children 且未标记 isLeaf / loaded 的节点，展开时触发加载 | boolean | — |
load | 懒加载回调 (payload: { key }) => void，与 oas-load 事件并存；宿主回填子节点后重设 data 属性 | (payload: { key: string }) => void | — |
row-height | 虚拟化时每行固定高度（px） | string | 32 |
selected | 选中节点 key | string | — |
事件
| 事件 | 说明 |
|---|---|
oas-check | 勾选变化，detail: { key, checked } |
oas-load | 懒加载触发，detail: { key }；宿主回填 children 后重设 data 属性 |
oas-node-drop | 节点拖放，detail: { dragKey, dropKey, position }，position 为 before / after / inner；dropKey 为空字符串表示移入根 |
oas-select | 选中节点，detail: { key, selected } |
节点字段说明：
isLeaf: true表示显式叶子（懒加载下不显示展开箭头）；loaded: true表示已加载完成（配合children使用，避免重复触发加载）。