DialogLayout函数示引用对话框
author: 李士强
定义
函数示引用对话框。
图片展示
代码演示
// 页面引用DialogLayout 注意DialogLayout的父级最好不要出现滚动条,以免定位不准确
import jimu from 'pile'
const DialogLayout = jimu.Dialog.DialogLayout
// 引入以后就可以在全局下调用这三种弹窗了
window.alertDialog({
msg:'alertDialog'
})
window.toastDialog({
msg:'toastDialog'
})
window.confirmDialog({
msg:'toastDialog'
})
属性
alertDialog
参数 | 描述 | 数据类型 | 默认值 |
---|---|---|---|
width | 弹窗宽度 | string | 所有div宽度写法都支持 |
show | 显示/隐藏 弹窗 | Boolean | true |
iconHide | 显示/隐藏 弹窗内部图标 | Boolean | false |
type | 弹窗图标类型 | string | fail(success/fail) |
msg | 消息 | string | null |
children | 子元素 | reactElement | null |
btnText | button文案 | string | 我知道了 |
beforeCallBack | 弹窗按钮点击之前的回调函数,如果传了这个函数,只有在函数返回结果为true弹窗才会隐藏 | function | undefined |
callBack | 弹窗按钮点击之后的回调函数 | function | undefined |
isMaskClick | 点击弹窗空白部分,是否隐藏 | Boolean | false |
toastDialog
参数 | 描述 | 数据类型 | 默认值 |
---|---|---|---|
show | 显示/隐藏 弹窗 | Boolean | true |
type | 弹窗图标类型 | string | success(success/fail/wrong) |
msg | 消息 | string | null |
time | 显示时长 | ms | 3000 |
callBack | 弹窗消失之后的回调函数 | function | undefined |
confirmDialog
参数 | 描述 | 数据类型 | 默认值 |
---|---|---|---|
show | 显示/隐藏 弹窗 | Boolean | true |
iconHide | 显示/隐藏 弹窗内部图标 | Boolean | false |
type | 弹窗图标类型 | string | fail(success/fail) |
children | 子元素 | reactElement | null |
btnType | 确认按钮类型 | string | default(default/orange) |
msg | 消息 | string | null |
cancelText | 取消按钮文案 | string | 取消 |
btnText | 确认按钮文案 | string | 确定 |
cancelBeforeCallBack | 取消按钮点击前的回调函数,如果传了这个函数,只有在函数返回结果为true弹窗才会隐藏 | function | undefined |
cancelCallBack | 取消按钮点击后的回调函数 | function | undefined |
beforeCallBack | 确定按钮点击前的回调函数,如果传了这个函数,只有在函数返回结果为true弹窗才会隐藏 | function | undefined |
callBack | 确定按钮点击后的回调函数 | function | undefined |
原文: https://didi.github.io/pile.js/docs/2017/08/develop-components-dialog-dialoglayout.html