iter(g116): 抽屉支持非模态模式
This commit is contained in:
+3
-1
@@ -1,6 +1,6 @@
|
||||
# @ui-arch 组件库 Agent 文档(无图形版)
|
||||
|
||||
> 自动生成于 2026-10-26T06:08:45.187Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
|
||||
> 自动生成于 2026-10-26T06:10:04.137Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
|
||||
> 组件 = 普通函数,传 props 返回 DOM;状态用 signal 双向绑定:读 signal() 写 signal(v)。
|
||||
|
||||
## 快速上手
|
||||
@@ -884,6 +884,7 @@ const open = signal(false); modal({ title: '确认操作', open, onClose: () =>
|
||||
- width(默认 320):number —— 面板尺寸(像素):左右滑出为宽度,上下滑出为高度;缺省 320
|
||||
- footer:unknown —— 底部操作区内容;缺省不渲染
|
||||
- closeOnOverlay:boolean —— 点遮罩是否关闭抽屉;缺省 true(× 与 Esc 始终可用)
|
||||
- modal:boolean —— 是否模态:false 时无遮罩、不锁背景滚动、不困焦点,页面仍可操作(检查器 / 详情面板);缺省 true
|
||||
- onClose(回调):() => void —— 关闭回调(点遮罩 / × / Esc 触发)
|
||||
- ...children:unknown[] —— 面板内容子节点
|
||||
|
||||
@@ -900,6 +901,7 @@ const open = signal(false); drawer({ title: '详情', open, width: 360, onClose:
|
||||
3. 点遮罩、× 或按 Esc 关闭并写回 false;打开时焦点落在面板首个可交互元素,Esc 只关最上层弹层
|
||||
4. 底部操作按钮放进 footer;与 modal 的分工:modal 是强打断的确认,drawer 保留主视图上下文做详情/编辑
|
||||
5. 面板内容与 modal 一样接受任意 DOM 与响应式函数
|
||||
6. 要「一边看一边改」就把 modal 设成 false:遮罩透明且不吃点击、背景滚动不锁、Tab 不被困在面板里,× 与 Esc 仍能关
|
||||
|
||||
现场演示:apps/docs/demo.html#sec-drawer
|
||||
|
||||
|
||||
Reference in New Issue
Block a user