React Modal
React based dialog box components, automatic center, adaptive size, support before and after open callback methods
Install
yarn add @zddi/modal
Usage Modal
import Modal from "@zddi/modal";
import "@zddi/modal/modal.css";
API
| Property | Type | Default | Description |
|---|---|---|---|
| open | Boolean | false | Whether to open the dialog box |
| close | Function | - | Close the triggered callback function |
| loading | Boolean | true | Whether to display loading |
| children | React Node | - | Used to confine a dialog box content area |
| footer | React Node | - | Used at the bottom of the configuration dialog |
| showMask | Boolean | true | Show the mask layer |
| closeOnEsc | Boolean | true | Whether support press esc to close |
| closeOnDocumentClick | Boolean | false | Support for clickable document closure |
| showHeader | Boolean | true | Whether to display the title or not |
| dragHeader | Boolean | true | Whether dragging is supported |
| beforeOpen | Function | - | The callback function that fires before the dialog box opens |
| beforeClose | Function | - | The callback function that fires before the dialog box closes |
| isForm | Boolean | false | The outer layer is wrapped with the form tag |
| FormProps | Object | { } | Attribute of the form tag |
版本历史
1.1.10
2024 年 1 月 26 日 星期五 10 时 04 分 31 秒 CST
- 支持
form标签包裹
1.1.8
2023 年 9 月 18 日 星期一 14 时 04 分 11 秒 CST
- 删除全局变量modalWrapScroll，还原 modal 内容的最大高度，增加全局变量modalDynamicMaxHeight 控制 modal 最大高度是否动态获取浏览器高度
1.1.7
2023 年 9 月 14 日 星期四 10 时 04 分 37 秒 CST
- wrapScroll 参数替换为全局变量__modalWrapScroll 控制
1.1.6
2023 年 9 月 5 日 星期二 10 时 27 分 04 秒 UTC
- 新增 wrapScroll 参数，调整 z-index