spz-lightbox 对话框
模态对话框。
布局
布局
跳转到“布局”何时使用
跳转到“何时使用”需要用户处理事务，又不希望跳转页面以致打断工作流程时，可以使用 lightbox 在当前页面正中打开一个浮层，承载相应的操作。
代码演示
跳转到“代码演示”基本用法
跳转到“基本用法”- 当
lightbox打开时，可以通过点击蒙层或者点击关闭按钮来关闭lightbox。 - 当
lightbox打开时，页面底部禁止滚动。
Basic Lightbox
Some contents...
Some contents...
Some contents...
<button @tap="lightbox.open">Open lightbox</button>
<spz-lightbox layout="nodisplay" id="lightbox" hidden>
<div>
<div>
<h3>Basic Lightbox</h3>
<button @tap="lightbox.close">Close</button>
</div>
<div>Some contents...</div>
<div>Some contents...</div>
<div>Some contents...</div>
</div>
</spz-lightbox>属性
跳转到“属性”| 属性名 | 说明 | 类型 | 默认值 | 是否必需 |
|---|---|---|---|---|
| disable-unmount | 如果该属性存在，禁止元素关闭时卸载 | - | - | 否 |
| unclose-in-focus | 如果该属性存在，当元素获得失去焦点时，关闭对话框 | - | - | 否 |
方法
跳转到“方法”open
跳转到“open”打开对话框，不需要参数。
close
跳转到“close”关闭对话框，不需要参数。
事件
跳转到“事件”open
跳转到“open”当打开对话框时组件自动触发该事件，不需要参数。
close
跳转到“close”当关闭对话框时组件自动触发该事件，不需要参数。