---
nav:
    title: 组件
    path: /components
group:
    title: 反馈
    path: /feedback
    order: 4
---

# VtxFullScreenModal 对话框

需要用户处理事务，又不希望跳转页面以致打断工作流程时，可以使用 Modal 在当前页面正中打开一个浮层，承载相应的操作。

**变更点**

-   默认全屏
-   默认宽度为`700px`
-   默认点击蒙层不关闭
-   加入对话框全屏功能和相关回调
-   非全屏状态下限制对话框最大高度为 `(window.innerHeight * 0.7)px`
-   destroyOnClose 默认为 true

## 代码演示

### 基本用法

<code src="./demo/demo1.jsx">

## API

更多 API 参考[Modal](https://ant.design/components/modal-cn/)，以下为差异点

### VtxFullScreenModal

| 参数          | 说明                   | 类型                                         | 默认值 | 版本 |
| ------------- | ---------------------- | -------------------------------------------- | ------ | ---- |
| maximize      | 是否显示右上角全屏按钮 | <font color=#c41d7f >boolean</font>          | false  |      |
| onModalResize | 点击全屏按钮回调       | <font color=#c41d7f >function(option)</font> | 无     |      |
| moveable      | 是否可以拖动           | <font color=#c41d7f >boolean</font>          | false  |      |

### VtxFullScreenModal.size

```jsx | pure
VtxFullScreenModal.size = {
    xsmall: 392, // 1-3项时使用
    small: 500, // 4-6项时使用
    middle: 744, // 7-14项时使用
    large: 1096, // 14项以上时使用
};

<VtxFullScreenModal width={VtxModal.size.xsmall}></VtxFullScreenModal>;
```