Modal 模态框
提供一个简单的 Modal 框,也可以作为 Dialog (对话框) 之类的组件使用,在页面上的层级为 1000
使用指南
在 Taro 文件中引入组件
:::demo
1. import { AtModal, AtModalHeader, AtModalContent, AtModalAction } from 'taro-ui'
:::
一般用法
:::demo
1. <AtModal isOpened>
2. <AtModalHeader>标题</AtModalHeader>
3. <AtModalContent>
4. 这里是正文内容,欢迎加入京东凹凸实验室
5. 这里是正文内容,欢迎加入京东凹凸实验室
6. 这里是正文内容,欢迎加入京东凹凸实验室
7. </AtModalContent>
8. <AtModalAction>
9. <Button>取消</Button>
10. <Button>确定</Button>
11. </AtModalAction>
12. </AtModal>
:::
简化使用
:::demo
1. <AtModal
2. isOpened
3. title='标题'
4. cancleText='取消'
5. confirmText='确认'
6. onCancle={ this.handleCancle }
7. onConfirm={ this.handleConfirm }
8. content='欢迎加入京东凹凸实验室\n\r欢迎加入京东凹凸实验室'
9. />
:::
AtModal 参数
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| title | 元素的标题 | String | - | - |
| content | 元素的内容 | String | - | - |
| cancleText | 取消按钮的文本 | String | - | - |
| confirmText | 确认按钮的文本 | String | - | - |
| onCancle | 点击取消按钮触发的样式 | Function | - | - |
| onConfirm | 点击确认按钮触发的事件 | Function | - | - |
