element-UI的Dialog弹出框蒙版被遮住

类似于这种,相信会有很多人遇到这种问题的,其实解决的方法很简单
<el-dialog title="修改分类" :visible.sync="modifyFormVisible" :modal-append-to-body="false" width="30%" center>
<el-form :model="modifyData" ref="modifyForm" :rules="rules">
<el-form-item label="分类名称:" label-width="100px" prop="categoryName">
<el-input v-model="modifyData.categoryName" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="分类级别:" label-width="100px" prop="categoryLevel">
<el-input v-model="modifyData.categoryLevel" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="目录层级:" label-width="100px" prop="parentCode">
<el-input v-model="modifyData.parentCode" auto-complete="off"></el-input>
</el-form-item>
</el-form>
只需要加一条 :modal-append-to-body="false" 其实仔细看官方文档的同学也会发现这个的,它接受一个布尔值,默认为true的,我们需要把它改成false,让遮罩层插入至 body 元素上
element-UI的Dialog弹出框蒙版被遮住的更多相关文章
- vue--vant组件库Dialog弹出框
安装vant UI框架: cnpm install vant –-save-dev 导入组件-在main.js里: import Vant from 'vant'; import'vant/lib/v ...
- 使用easeui dialog弹出框中使用CKeditor多次加载后无法编辑问题
问题呈现:弹出框页面 <tr class="addtr"> <th>内容</th> <td> <!-- <textare ...
- vue在element-ui的dialog弹出框中加入百度地图
参考:https://blog.csdn.net/u012724595/article/details/82703579 <!-- gps弹窗 --> <el-dialog v-di ...
- JQuery EasyUI dialog弹出框的 close 和 destroy
开发项目中(使用JQuery EasyUI),根据业务需要重叠弹出多个提示框的情况,会出现如下情况:页面出现两个div模块调用同一个弹出页面,页面的数据接受框元素不能实时存储数据解决方案: 使用$(t ...
- 弹出框插件——dialog
基于jquery和dot.js弹出框插件,兼容IE6+等其他浏览器. 思想:弹出框元素插入body节点中,并在页面垂直居中显示(fixed定位),触发确定和关闭事件绑定. 注意ie6包含两个问题:一. ...
- Android 如何利用Activity的Dialog风格完成弹出框设计
在我们使用Dialog时,如果需要用到很多自己设计的控件,虽然可以让弹出框显示出我们需要的界面,但却无法找到地方完成控制代码的编写,如何解决这个问题呢,我们可以将Activity伪装成Dialog弹出 ...
- JavaScript插件——弹出框
(JavaScript插件——弹出框) 前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.htm ...
- element ui中dialog相关问题
一,今天需要在dialog里面引入另一个页面,就是打开dialog显示该页面(把页面放到dialog中),引入的语句如下: <iframe src="view?path=rkdj_b& ...
- Android--自定义弹出框-自定义dialog
项目要用到弹出框,还要和苹果的样式一样(Android真是没地位),所以就自己定义了一个,不是很像(主要是没图),但是也还可以. 废话不多说了,直接上代码 1.先看布局文件 <?xml vers ...
随机推荐
- element-tree-grid(表格树)的使用
表格树,element-tree-grid需要单独下载并再配合elementUi里el-table使用. 步骤:1.npm install element-tree-grid --save(下载ele ...
- GlusterFS群集存储项目
最小化安装的centos7.5 内存大于1GB 关闭selinux,防火墙端口放行(port:24007,111)(测试建议关闭firewalld) 一.环境部署 所有软件包离线安装,原因是yum安装 ...
- pyspider安装提示:got an unexpected keyword argument 'io_loop'的解决办法
此问题解决办法学习自pyspider的github的issues 原地址:https://github.com/binux/pyspider/issues/771 解决方法: 由于最新版的Tornad ...
- bootstarp 多图片上传 带进度条
前台代码如下: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head&g ...
- 把ESXi中的虚拟机通过OVA/OVF导出的方式迁移到Proxmox 5
引用地址:https://blog.csdn.net/zebra2011/article/details/83046841 一.前言 之前发现ESXi是免费的时候,非常兴奋地把几台服务器都装上了 ...
- C++11のlambd表达式
在其他语言中,我们常见lambda表达式,c++11中也引入了. 利用Lambda表达式,可以方便的定义和创建匿名函数.今天,我们就来简单介绍一下C++中Lambda表达式的简单使用. 一.lambd ...
- vue启动时候报错
使用vue时,在已经安装模块完毕的情况下,依旧会报错,如: Module build failed: Error: %1 is not a valid Win32 application. 这个时候只 ...
- FineUIPro/Mvc/Core v5.4.0即将发布(Core基础版,新功能列表)!
FineUIPro/Mvc/Core v5.4.0 即将于 2019-03-04 发布,目前官网示例已更新,先睹为快:http://pro.fineui.com/http://mvc.fineui.c ...
- 用div画三角/矩形/圆
1. 画三角 <!DOCTYPE html> <html> <head> <title></title> <meta charset= ...
- KVM宿主机上虚拟机动态添加新磁盘
(1)KVM宿主机查看运行的虚拟机 $ virsh list --all (2)将qcow2的磁盘移动到/var/lib/libvirt/images/,比如为centos.qcow2 (3)进入/e ...