iter(g67): tag 支持 checkable 筛选片,选中态与 aria-pressed 同步
This commit is contained in:
+5
-1
@@ -1,6 +1,6 @@
|
||||
# @ui-arch 组件库 Agent 文档(无图形版)
|
||||
|
||||
> 自动生成于 2026-10-26T04:34:05.417Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
|
||||
> 自动生成于 2026-10-26T04:35:37.103Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
|
||||
> 组件 = 普通函数,传 props 返回 DOM;状态用 signal 双向绑定:读 signal() 写 signal(v)。
|
||||
|
||||
## 快速上手
|
||||
@@ -442,6 +442,9 @@ badge({ label: '成功', variant: 'success' })
|
||||
- variant(默认 default):'default' | 'success' | 'warning' | 'danger' | 'info' —— 语义色;缺省 default
|
||||
- closable(默认 false):boolean —— 显示 × 关闭按钮;缺省 false(纯展示)
|
||||
- onClose(回调):() => void —— 关闭回调:调用方从数据源移除该项后重新渲染
|
||||
- checkable(默认 false):boolean —— 可选中:渲染为筛选片(button + aria-pressed);与 closable 互斥,同时传以 checkable 为准
|
||||
- checked:Signal<boolean> —— 选中态信号,双向绑定(点击写回、外部赋值同步);不传则组件内部自持
|
||||
- onChange:(checked: boolean) => void —— 选中态变化回调,参数是点击后的新值
|
||||
|
||||
示例:
|
||||
|
||||
@@ -456,6 +459,7 @@ tag({ label: '前端', variant: 'info', closable: true, onClose: () => remove('
|
||||
3. closable: true 时必须配 onClose:把数据源里的该项删掉再重渲染(组件无状态,不自行摘除节点)
|
||||
4. 组合用法:容器里用 renderList 按信号数组渲染 tag 列表,删除即写回信号
|
||||
5. 标签是内联元素,可直接排进 .row 等容器,自动换行由容器决定
|
||||
6. 需要可点的筛选片时传 checkable + checked:点击写回信号,视觉与 aria-pressed 同步,不做整块重渲染(焦点不丢)
|
||||
|
||||
现场演示:apps/docs/demo.html#sec-tag
|
||||
|
||||
|
||||
Reference in New Issue
Block a user