更新记录

1.0.0(2022-09-30) 下载此版本

实例化组件


平台兼容性

uni-app

Vue2 Vue3 Chrome Safari app-vue app-nvue Android iOS 鸿蒙
√ √ √ √ √ √ - - -
微信小程序 支付宝小程序 抖音小程序 百度小程序 快手小程序 京东小程序 鸿蒙元服务 QQ小程序 飞书小程序 小红书小程序 快应用-华为 快应用-联盟
√ √ √ √ √ √ - √ √ - √ √

其他

多语言 暗黑模式 宽屏模式 蒸汽模式
× × √ ×

Page Code

<wly-dialog title="提示" :visible.sync="dialogVisible" width="30%">
        <span>这是一段信息</span>
        <span slot="footer" class="dialog-footer">
            <wly-button @click="dialogVisible = false">取 消</wly-button>
            <wly-button type="primary" @click="dialogVisible = false">
                确 定
            </wly-button>
        </span>
    </wly-dialog>

Attributes

参数 说明 类型 可选值 默认值
visible 是否显示 Dialog,支持 .sync 修饰符 boolean —— false
title Dialog 的标题,也可通过具名 slot (见下表)传入 string —— ——
width Dialog 的宽度 string —— 50%
fullscreen 是否为全屏 Dialog boolean —— false
top Dialog CSS 中的 margin-top 值 string —— 15vh
modal 是否需要遮罩层 boolean —— true
modal-append-to-body 遮罩层是否插入至 body 元素上,若为 false,则遮罩层会插入至 Dialog 的父元素上 boolean —— true
append-to-body Dialog 自身是否插入至 body 元素上。嵌套的 Dialog 必须指定该属性并赋值为 true boolean — false
lock-scroll 是否在 Dialog 出现时将 body 滚动锁定 boolean — true
custom-class Dialog 的自定义类名 string — —
close-on-click-modal 是否可以通过点击 modal 关闭 Dialog boolean — true
close-on-press-escape 是否可以通过按下 ESC 关闭 Dialog boolean — true
show-close 是否显示关闭按钮 boolean — true
before-close 关闭前的回调,会暂停 Dialog 的关闭 function(done),done 用于关闭 Dialog — —
center 是否对头部和底部采用居中布局 boolean — false
destroy-on-close 关闭时销毁 Dialog 中的元素 boolean — false

Slot


name 说明
— Dialog 的内容
title Dialog 标题区的内容
footer Dialog 按钮操作区的内容

Events


事件名称 说明 回调参数
open Dialog 打开的回调 —
opened Dialog 打开动画结束时的回调 —
close Dialog 关闭的回调 —
closed Dialog 关闭动画结束时的回调 —

隐私、权限声明

1. 本插件需要申请的系统权限列表:

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

无

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

无

许可协议

MIT协议

暂无用户评论。