iter(g61): tree 支持勾选多选与父子级联

This commit is contained in:
HIsheR
2026-10-26 12:26:46 +08:00
parent 0dd0f50985
commit f56ca51cb0
7 changed files with 140 additions and 44 deletions
+6 -1
View File
@@ -1,6 +1,6 @@
# @ui-arch 组件库 Agent 文档(无图形版)
> 自动生成于 2026-10-26T04:24:59.738Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
> 自动生成于 2026-10-26T04:26:29.979Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
> 组件 = 普通函数,传 props 返回 DOM;状态用 signal 双向绑定:读 signal() 写 signal(v)。
## 快速上手
@@ -1082,6 +1082,9 @@ const i = signal(0); carousel({ items: [h('div', null, 'A'), h('div', null, 'B')
- selected:Signal<string> —— 选中 key 信号;不传则内部维护
- defaultExpandAll:boolean —— 首屏展开全部分支;缺省 false
- onSelect(回调):(node: TreeNode) => void —— 选中回调:点击标签或 Enter/空格触发
- multi:boolean —— 是否显示勾选框并开启多选;缺省 false
- checked:Signal<string[]> —— 勾选 key 集合(multi 时生效);不传则内部维护
- onCheck:(keys: string[]) => void —— 勾选变更回调(父子已级联,传副本)
示例:
@@ -1096,6 +1099,8 @@ const sel = signal(''); tree({ nodes: [{ key: 'src', label: 'src', children: [{
3. 点箭头只展开/收起,点标签才选中;叶子节点箭头位置留空以对齐
4. 键盘:↑↓ 在可见节点间移动、Home/End 到首末行(只移动焦点),Enter/空格 选中、→ 展开、← 收起;disabled 节点点击与键盘都不响应
5. defaultExpandAll 首屏展开全部分支(外部已给 expanded 初值时以外部为准)
6. multi: true 时每行前置勾选框:勾父级下钻全选子孙(跳过禁用项),子孙全选后父级自动上勾、部分勾选显示半选
7. 勾选框点击不触发选中(stopPropagation),键盘在多选模式下 Enter/空格改为切换勾选
现场演示:apps/docs/demo.html#sec-tree