el-dialog 不要全屏遮罩

如果你不想让 `el-dialog` 组件全屏遮罩，你可以通过设置 `modal` 属性来实现。将 `modal` 设置为 `false`，即可取消全屏遮罩效果。例如：

<el-dialog :visible="dialogVisible" :modal="false">
  <!-- dialog 内容 -->
</el-dialog>

这样设置后，`el-dialog` 组件将不再全屏遮罩，并且可以与背景交互。希望这对你有所帮助！如果还有其他问题，请随时提问。

相关问题

el-dialog全屏展示不生效

`el-dialog`是Element UI库中的一个弹窗组件，如果你想让它全屏展示不生效，可能是以下几个原因导致的：

1. **默认设置**：`el-dialog`的默认样式并未将其设置为全屏模式。你可以通过修改其样式，比如设置`width`和`height`为100%，或者覆盖其默认CSS。

.el-dialog {
  width: 100%;
  height: 100vh; /* vh单位表示视口高度 */
}

2. **动态调整**：如果你希望在特定条件下才显示全屏，可以监听窗口大小变化，然后动态改变dialog的样式。

document.addEventListener('resize', function() {
  var dialog = document.querySelector('.your-dialog-id');
  if (/* 判断是否需要全屏 */){
    dialog.style.width = '100%';
    dialog.style.height = '100vh';
  } else {
    // 取消全屏样式
  }
});

3. **关闭遮罩层**：有些情况下，dialog的全屏效果可能会因为背景遮罩层（`.el-dialog__mask`）影响而无法完全覆盖屏幕，你可以考虑移除遮罩层或者调整其透明度。

4. **限制浏览器兼容性**：某些浏览器可能对全屏API有所限制，确保你的解决方案在目标浏览器上正常工作。

如果以上方法都试过还是无效，检查一下是不是有其他冲突的CSS规则，或者是否有错误的代码阻止了全屏功能。

el-dialog所有属性

el-dialog 是 Element UI 中的一个组件，它有以下属性：

1. title：对话框的标题。
2. visible：对话框是否可见。
3. width：对话框的宽度。
4. fullscreen：对话框是否全屏显示。
5. top：对话框距离页面顶部的距离。
6. modal：是否需要遮罩层。
7. modal-append-to-body：是否将遮罩层插入到 body 中。
8. lock-scroll：是否锁定背景滚动。
9. close-on-click-modal：是否可以通过点击遮罩层关闭对话框。
10. close-on-press-escape：是否可以通过按下 Esc 键关闭对话框。
11. show-close：是否显示关闭按钮。
12. center：是否居中显示对话框。
13. destroy-on-close：是否在关闭对话框时销毁对话框实例。
14. append-to-body：是否将对话框插入到 body 中。
15. custom-class：自定义类名。
16. close: 点击关闭按钮时触发的事件。
17. open: 对话框打开时触发的事件。
18. opened: 对话框打开且动画结束后触发的事件。
19. close: 对话框关闭时触发的事件。
20. closed: 对话框关闭且动画结束后触发的事件。

以上属性都可以通过在 el-dialog 标签中进行设置。