底部弹窗切换器
@astryxdesign/core v0.7.1 · BottomSheetSwitcher
属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
activeSheet | string | null | null | 用 v-model:active-sheet 绑定。值是当前要显示那一步的 sheet-id;绑成 null 就整段关掉。 |
label | string | — | 整段流程的读屏名称。不传就用当前那张面板自己的 label,都没有时用 Bottom sheet。 |
purpose | 'info' | 'form' | 'required' | 跟当前面板的 purpose | 整段流程怎么被关掉。info 允许 Escape、点遮罩和下滑;form 只允许 Escape;required 堵住所有隐式关闭。 |
hasScrim | boolean | true | 整段流程共用一层遮罩。换页时它一直留着,只有整段关掉才消失。关掉它,背后页面仍然可以滚动和点击。 |
事件
update:activeSheet(value: string | null):切换器想切到哪一步就发哪个sheet-id,想关掉时发null。这就是v-model:active-sheet的绑定。cancel(event: Event):对话框收到原生 cancel 请求时先发这个事件。在事件上调用event.preventDefault()可以留住这段流程,不让它关掉。
插槽
default:放各个BottomSheet步骤。每一张都要有自己不重复的sheet-id和自己的label。