仅桌面端保证样式
Tree 树形控件
层级数据展示与交互：展开/收起、勾选（父子联动可选）、选中高亮、搜索过滤与懒加载，常用于组织架构、目录、权限树。
基础用法
点击节点：—
勾选模式
选中高亮（受控）
highlight-current 开启点击高亮，current-change 拿到当前节点；实例方法 setCurrentKey / getCurrentKey 支持程序化选中，传 null 取消选中：
当前：—
勾选联动与半选
父子默认级联：全选父级勾选全部后代，部分勾选呈半选态；check-strictly 切换为父子互不联动。check 事件携带完整勾选信息，也可随时用 getCheckedKeys(true) 只取叶子、getHalfCheckedKeys() 取半选：
父子勾选不联动（check-strictly）
勾选节点试试
懒加载
lazy + load 按需拉取子级：首次展开未加载节点时调用 load(node, resolve)，resolve([]) 即视为叶子；未提供初始 data 时挂载后自动加载根级：
暂无数据
搜索过滤
先传 filter-node-method 声明匹配规则，再调用实例方法 filter(value) 触发过滤——命中的节点连同其祖先链保留展示，清空关键词即恢复：
键盘操作
树容器可聚焦（tabindex="0"，子节点不进入 Tab 序）：↑ / ↓ 按可见顺序移动当前节点（highlight-current 开启时联动高亮与 current-change），→ 展开当前节点、← 收起，Enter 选中（同点击语义），Space 在开启复选框时切换勾选（父子级联）。节点带 role="treeitem" 与 aria-expanded / aria-selected / aria-checked 标记。
Tree API
Tree Props
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| data | 树形数据源，字段可用 props 映射 | array | [] |
| props | 字段映射 { children, label, disabled, isLeaf } | object | {} |
| node-key | 唯一键字段，实例方法与勾选回显依赖它 | string | — |
| show-checkbox | 节点前显示复选框 | boolean | false |
| check-strictly | 父子勾选不联动 | boolean | false |
| default-expand-all | 默认展开全部 | boolean | false |
| default-expanded-keys | 默认展开的节点 key | array | [] |
| default-checked-keys | 默认勾选的节点 key（非严格模式向下级联） | array | [] |
| expand-on-click-node | 点击节点展开/收起 | boolean | true |
| check-on-click-node | 点击节点切换勾选（需开启复选框） | boolean | false |
| highlight-current | 点击高亮当前节点，配合 current-change 与 setCurrentKey | boolean | false |
| current-node-key | 初始选中节点 key | string | number | — |
| filter-node-method | 过滤匹配函数 (word, data) => boolean，配合 filter() 方法 | function | null |
| accordion | 手风琴模式，同父兄弟节点互斥展开（全层级生效） | boolean | false |
| indent | 层级缩进像素 | number | 16 |
| empty-text | 空数据文案 | string | 暂无数据 |
| lazy / load | 懒加载开关与加载函数 load(node, resolve) | boolean / function | false / null |
Tree Events
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| node-click | 节点被点击 | (data, node) => void | — |
| node-expand / node-collapse | 节点展开 / 收起 | (data, node) => void | — |
| check | 勾选变化，携带勾选与半选明细 | (data, { checkedKeys, checkedNodes, halfCheckedKeys, halfCheckedNodes }) => void | — |
| check-change | 节点勾选状态变化 | (data, checked: boolean) => void | — |
| current-change | 当前高亮节点变化（需 highlight-current） | (data, node) => void | — |
| node-contextmenu | 节点右键菜单 | (event, node) => void | — |
Tree Methods（defineExpose）
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| filter | 按关键词过滤，配合 filter-node-method 使用 | (value) => void | — |
| setCheckedKeys / getCheckedKeys | 批量设置 / 获取选中 key，getCheckedKeys(leafOnly) 可只取叶子 | (keys) / (leafOnly?) => void / array | — |
| setChecked | 设置单个节点勾选（非严格模式向下级联） | (key, checked) => void | — |
| getCheckedNodes | 获取选中节点的原始数据 | (leafOnly?) => array | — |
| getHalfCheckedKeys / getHalfCheckedNodes | 获取半选节点 key / 原始数据 | () => array | — |
| getNode | 按 key 取内部节点（含 childNodes / level / isLeaf） | (key) => node | null | — |
| setCurrentKey / getCurrentKey | 程序化选中 / 读取当前选中 key，传 null 取消选中 | (key) / () => void / key | — |
| getCurrentNode | 读取当前选中节点的原始数据 | () => data | null | — |