- 设计准则
- 设计风格
- 控件
- pile of React
- 组件规范
- 定制主题
- 多语言
- components 组件
- score
- Anime
- picker
- dialog
- slider
- Form 表单
- fragment
文章来源于网络收集而来,版权归原创者所有,如有侵权请及时联系!
DialogLayout 函数示引用对话框
定义
函数示引用对话框。
图片展示
代码演示
// 页面引用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 |
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论