手册版本 V5.0
组件介绍
gui-popup 组件可以实现在页面的中间、顶部、底部、左侧、右侧以动画形式展示一个弹层。
组件名称
gui-popup : /graceUI/组件目录/gui-popup
兼容平台
| H5 | APP | 小程序 | NVUE |
| ✔ | ✔ | ✔ | ✔ |
组件属性
| 属性名称 | 类型 | 默认值 | 作用 |
| width | String | 580rpx | 核心区域宽度( 居中、左、右有效 ) |
| bgColor | String | rgba(0, 0, 0, 0.7) | 遮罩层背景颜色 |
| position | String | center | 核心区域位置，center：居中、top：顶部、 bottom：底部、left：左侧、right：右侧 |
| canCloseByShade | Boolean | true | 点击遮罩层是否关闭组件 |
| zIndex | Number | 99999 | 组件 z-index 值 |
| top | Number | 0 | 组件 top 值，单位 px |
| duration 2021.10.19 新增 | Number | 280 | 组件动画时长 |
组件方法
01. open : 展示组件；
02. close : 关闭组件；
组件事件
01. @open : 组件展示时触发；
02. @close : 组件关闭时触发；
演示代码
UNI 普通版本
NVUE 版本
登录并购买 GraceUI 后可以查阅完整手册内容 。