el-dialog

element ui使用滚动条组件el-scrollbar(官方没有)解决对话框el-dialog的滚动条问题

今天写vue+elementui写项目时有个需求是要在对话框中进行操作，但是当对话框内容过多时却不会出现滚动条，通过修改样式后虽然出现滚动条，但是滚动条的样式不是很理想，通过查找发现了elementui官方没有的隐藏组件el-scrollbar(滚动条组件)//我在这里设置高度未300px......将内容写在el-scrollbar组件中，超过定义的高度后就会出现滚动条.el-scrollbar
濮家大少·2020-09-12 00:30

element-ui dialog组件根据屏幕自定义宽度

vue时，会用到el-dialog做为弹窗，但这个弹窗的宽度默认为50%.因项目中需要根据电脑屏幕的不同，来设置弹窗的不同的宽度，高度自定义，经查找资料，总结如下：第一步：组件上自定义宽度第二步：拿到屏幕的宽度
Amy1918·2020-09-11 15:45

基于element-ui对话框el-dialog初始化的校验问题解决

不刷新页面重新打开el-dialog时，如果我们绑定了rules或者某个值需要required，它总会自动校验。
·2020-09-11 15:34

(精华)2020年7月17日 vue element-ui实现弹窗拖拽

binding,vnode){constdialogHeaderEl=el.querySelector('.el-dialog__header')constdragDom=el.querySelector('.el-dialog
愚公搬代码·2020-09-11 13:42

vue中让input自动聚焦的方法

的el-input：directives:{focus:{inserted:function(el){el.querySelector('input').focus();}}}如果el-input是在el-dialog
qq_34465778·2020-09-11 09:17

elementui更改el-dialog关闭按钮的图标

先上图主要是添加一下样式.el-dialog__headerbtn{top:8px!important;background:url('https://你路径资源的url图片')leftno-repeat;background-size:cover;}.el-dialog__headerbtni{content:'修改下面的font-size可以改变图片的大小';font-size:25px;vi
danbing2226·2020-09-10 21:53

2020-09-03【element图片预览插件】

无需引用插件版如果el-image-viewer组件在el-dialog里面，el-dialog的层级是优先的，因此我们需要属性z-index去更改el-image-viewer组件样式的层级预览exportdefault
良言SE·2020-09-10 16:12

Vue+ElemtUI中对el-dialog弹出框宽度调整方法

最终我在el-dialog增加了一个customClass代码如下：弹出框的内容：。。。。。。。。。。。。。
代码攻城狮·2020-08-24 11:38

vue+elementUI项目中，el-dialog弹出框被遮罩层覆盖

vue+elementUI项目中，el-dialog弹出框被遮罩层覆盖一、问题表现el-dialog弹出框被遮罩层覆盖但是，浏览器调试时，明明遮罩层比弹出框z-index层级小【低一层】。
AIU哎呀·2020-08-24 07:21

vue.js通过element-ui实现上传进度条展示

一、简单记一下：1、使用的组件：el-upload/el-dialog/el-progress2、上传事件处理3、axios发送http请求，并通过回调函数传递进度progress二、遇到的难点：1、progress
日常修行·2020-08-22 19:29

element组件库el-dialog里边包含子组件的mounted钩子只执行一次的解决办法

（例如使用：新增、编辑、详情，使用弹框组件时）该组件只在页面加载中，加载一次，后面不会再加载了，如el-dialog解决办法如下：在组件标签中加v-if来控制组件el-dialog的出现与否,每次弹出el-dialog
CaseyWei·2020-08-22 16:31

火狐浏览器css深度选择器/deep/失效问题解决办法

chrome不会有问题解决办法：复制粘贴一份样式，子级不再使用/deep/深度选择器，从而兼容火狐浏览器实例：.dialog-index/deep/.el-dialog{height:100%!
CaseyWei·2020-08-22 16:31

vue router 多个操作使用同一页面，路径配置

场景：给订单计划添加线路的操作比较复杂，所以这里用页面的方式交互而非弹窗el-dialog【新增，查看，编辑】都需要传入id,如何共用一个页面vue.alias页面需要什么操作直接跳
Dear_Yuki·2020-08-22 16:54

Vuejs2.0的坑--Element UI 中的el-dialog包含子组件时，报错解决：TypeError: Cannot read property 'setActiveItem' of ...

真是坑，在el-dialog中使用el-carousel组件，想要动态修改幻灯片的当前激活的索引，element官网给出的文档写着可以用setActiveItem方法改变，但一直给我报setActiveItem
马小帅mm·2020-08-22 12:53

$message消息通知被el-dialog对话框的遮挡的问题

解决：在对话框el-dialog标签中添加z-index=“1000”(如果是两千多可能会导致第一次会被遮挡住，第一次后不会被遮挡的问题)
@~~涛·2020-08-20 20:41

VUE 问题记录

目录el-dialog点击空白处取消关闭el-inputplaceholder显示双引号""可拖动的窗口el-dialog点击空白处取消关闭el-dialog中加入:close-on-click-modal
zhchyun2008·2020-08-18 18:12

el-dialog动态显示title提示

假如你有一棵树，或者一个按钮，你点击这个树上的节点或者点击这个按钮，出来的对话框是一样的，但是对话框左边的提示不一样，这时候就需要动态添加title的提示语比如我点页面树的节点会出来添加人员按钮点击添加人员会出来这个dialog对话框左上角有个添加人员我需要在点击按钮的饿时候知道我在给树的哪个节点添加人员这时候就需要动态显示添加*人员而此时的就是树的节点的名称我这个树的数据在table.vue里面
卖萌的小猪·2020-08-18 15:07

vue组件间数据传递的易错点

问题出现如何解决警告原因el-dialog作为子组件时，怎么传递值给父组件知识点问题出现近期在使用vue做项目过程中，父组件a将数据传递给了子组件b，子组件b中做了状态的处理，然后习惯性的修改了父组件a
xiaoyinmochun·2020-08-18 06:28

element 拖拽和缩放

oldVnode){constdialogHeaderEl=el.querySelector('.el-dialog__header');constdragDom=el.querySelector('.el-dialog
嘉御山辉哥哥·2020-08-18 01:39

element 对话框拖拽

oldVnode){constdialogHeaderEl=el.querySelector('.el-dialog__header');constdragDom=el.querySelector('.el-dialog
嘉御山辉哥哥·2020-08-18 01:39

elementui更改el-dialog关闭按钮的图标d的示例代码

先给大家展示效果图：先上图主要是添加一下样式.el-dialog__headerbtn{top:8px!important;background:url('https://你路径资源的url图片')leftno-repeat;background-size:cover;}.el-dialog__headerbtni{content:'修改下面的font-size可以改变图片的大小';font-si
·2020-08-17 09:52

[element UI]记录一个“el-table里的el-dialog重叠问题”的解决

这里记录一个作为前端初学者使用vue+elementUI遇到的问题（犯的错误）。在项目里，用一张表来展示所有的编译记录，每个文件的编译结果为一条记录。需要实现点击展示项目编译结果，如图,当点击log的时候，会弹出响应的log内容。image.pngimage.png问题的重现,运行2个（或者多个）文件，然后点击log会发现出现弹出框重叠的现象。仔细看会发现上层dialog即当前真正点击的log的结
V_Jan·2020-08-14 10:25

记录element bug issuei：el-dialog的close事件有bug：导致回调方法被执行了两次

el-dialog的close事件有bug：导致回调方法被执行了两次目前最新版本2.13.2依旧存在这个问题!
Bidding.·2020-08-13 12:05

vue element 的el-dialog弹框不刷新，插入组件不刷新

vue的爬坑之路之前做项目的时候作为小白的我在使用element-ui的弹框el-dialog的时候弹框里面插入的是一个组件，因为是组件的问题导致每次点击弹框的时候页面组件里面的值没有进行刷新。
迟道仙·2020-08-11 05:00

Vue 中嵌入 iframe 并进行双向通信的完整流程

背景Vue应用中，需要使用el-dialog弹出一个iframe页面，该页面来源于其他项目，这就要解决Vue父页面和iframe子页面的两个通信问题：Vue父页面向iframe子页面传递初始化数据子页面的关闭按钮
毕小宝·2020-08-11 05:06

vue 对话框组件el-dialog标题修改及插槽的使用

点击打开Dialog需要注意的是内容是默认不居中的//此处插槽会替换标题栏的内容这是标题这是一段信息//此处插槽会替换按钮操作区的内容取消确定exportdefault{data(){return{centerDialogVisible:false};}};
青冘·2020-08-09 23:00

IE浏览器中element的对话框显示不完全

1在IE浏览器中，el-dialog的祖先级元素同时设置了border-radius和overflow：hidden，border-radius和overflow设置到不同元素上即可完整弹出弹框。
檀小泡泡·2020-08-09 15:06

vue+element项目中使用el-dialog弹出Tree控件报错问题

1.按正常的点击按钮,显示dialog弹出的Tree控件,然后把该条数据下的已经选中的checkbox,用setCheckedNodes或者setCheckedKeys方法选择上,报下面这个错的原因是出在setCheckedNodes(setCheckedKeys)方法这里,导致可以弹出Tree控件但是已选择的checkbox没有选中(点击两次就会选中~~)vue.runtime.esm.js:5
banjiaying9250·2020-08-09 07:15

element ui 饿了么UI中el-dialog样式修改问题

最近在使用element-ui时，使用到了弹窗组件：element-ui官网链接地址：element-ui官网链接地址类似于以下代码：这是一段信息取消确定我在使用过程中，发现弹窗行间样式不是我想要的，但是通过定义classname,然后在进行样式的更改不起作用，由于权重的问题，在样式后面添加!important无穷权重也是不可以。解决方法就是：去掉底部样式中的scoped,然后再进行页面级样式的更
yehaocheng520·2020-08-09 03:17

el-dialog 弹窗获取里面子组件（异常问题）

代码：问题：通过this.$refs.hwmxdialog拿不到子组件console.log(this.$refs.hwmxdialog);//undefined解决方法：this.$nextTick(()=>console.log(this.$refs.hwmxdialog));nextTick文档：https://cn.vuejs.org/v2/api/#Vue-nextTick类似问题文档：
雪梅零落·2020-08-09 03:54

vue中element-ui新增/更新弹框复用，在close时表单重置失败

问题描述：在el-dialog的close关闭事件中，使用了element-ui中表单重置方法this.
在奔跑中寻找·2020-08-09 01:35

解决element-ui对话框el-dialog初始化的校验问题

不刷新页面重新打开el-dialog时，如果我们绑定了rules或者某个值需要required，它总会自动校验。
TVM·2020-08-09 01:22

踩坑：Element-ui中el-dialog组件显示时有蒙层（遮罩层）怎么破？

到底是什么问题？没错就是这样，就像上图一样，上传完图片需要预览时，图片被蒙层遮罩住了。下面是整个组件的代码：图片上传、预览、删除，组件方法可以直接去Element-ui官方文档查看。methods:{handlePictureCardPreview(file){this.dialogImageUrl=file.urlthis.dialogVisible=true},handleRemove(fil
椰卤工程师·2020-08-09 01:54

el-dialog 显示和隐藏

//vue.js代码data(){return{tableData:[],value:"",options:[{value:1,text:"已审核"},{value:2,text:"审核中"},{value:3,text:"未审核"}],addformVisable:false//隐藏窗体};},methods:{add:function(){this.addformVisable=true;显示
代小二啊·2020-08-09 01:12

Elementui el-dialog 组件我又学会了一种新的用法

1.新建弹窗Form.vue文件将visible属性设置为true{{form.dicEntpollutanttypeStr}}-->{{form.pollutantname}}{{form.concentration}}{{form.produceamount}}{{form.environmentcontroldecrement}}{{form.emission}}保存取消关闭2.定义关闭弹窗
weixin_34365417·2020-08-09 00:18

覆盖（优化效果）el-dialog 的显示隐藏动画

element-uidialog本身的动画效果基本就是没动画效果（摊手）原来的弹窗动画优化后的动画只需加入以下这段css代码，非常简单.el-dialog__wrapper{transition-duration:0.3s;}.dialog-fade-enter-active{animation:none!important;}.dialog-fade-leave-active{transitio
weixin_34245749·2020-08-09 00:34

element-ui 的Dialog被蒙板遮住原因及解决办法

解决办法很简单，查看element的官方文档在el-dialog标签里添加下面两行代码的任意一行：:modal-append-t
weixin_34239592·2020-08-09 00:02

vue组件el-dialog重新执行mounted方法的技巧

该组件只在页面加载中，加载一次，后面不会再加载了，如el-dialog,解决办法如下，在el-dialog外再加一层div.示例代码如下：..div中以v-if来控制组件el-dialog的出现与否,每次弹出
weixin_33976072·2020-08-09 00:48

element-ui 可拖拽对话框dialog

oldVnode){constdialogHeaderEl=el.querySelector('.el-dialog__header');constdragDom=el.querySelector('.el-dialog
weixin_30613433·2020-08-08 23:35

Element UI 弹窗（Dialog）改成自适应高度，仅body内容部分滚动

定义样式如下：.abow_dialog{display:flex;justify-content:center;align-items:Center;overflow:hidden;.el-dialog
tomabow·2020-08-08 22:25

Element,el-dialog弹出层拖拽及拉伸、双击全屏

复制以下代码就可使用importVuefrom'vue';/**使用方法*将以下代码复制到一个js文件中，然后在入口文件main.js中import引入即可；*给elementUI的dialog上加上v-dialogDrag指令就可以实现弹窗的全屏和拉伸了。*给dialog设置:close-on-click-modal="false",禁止点击遮罩层关闭弹出层*如果是form表单，不要将提交等按钮
Q-u-a-n·2020-08-08 21:55

实现在vue中element-ui的el-dialog弹框拖拽

1、在utils中新建directives.js文件importVuefrom'vue'//v-dialogDrag:弹窗拖拽Vue.directive('dialogDrag',{bind(el,binding,vnode,oldVnode){constdialogHeaderEl=el.querySelector('.el-dialog__header')constdragDom=el.que
阿伦gh·2020-08-08 21:22

使用element-ui的弹出窗口时，由于滚动条造成的页面闪动问题

问题：在使用element-ui的el-dialog时，由于遮罩层的出现，导致页面的滚动条隐藏，从而使页面出现闪动的效果。
日落KK·2020-08-08 20:15

Vue：Element-UI 弹出窗口el-dialog使用iframe加载外部页面内容

想要实现如下效果在页面中点击链接，弹出窗口，窗口中加载指定的页面内容1.vue文件内容html部分的代码主要链接取消确定js部分的代码exportdefault{name:"indexJK",data(){return{name:"indexJK",dialogVisible:false,//弹出框};},methods:{test(){this.dialogVisible=true;}}};2.
奋斗鱼·2020-08-08 20:49

vue+elementui进行弹出框dialog的锁定操作

ElementUI+Vue在使用el-dialog时，在弹出dialog时，点击框框以外的空白部分就直接给关闭了。
小抠的菜鸟之路·2020-08-08 20:08

element-ui的el-form验证和el-dialog关闭时清除验证

在这里插入代码片//关闭弹窗closeDialog(formRule){this.$refs[formRule].resetFields()},
qq_45284875·2020-08-08 20:04

el-dialog 中使用 el-select,el-checkbox, 选择的时页面闪烁根本问题，操作时闪现

如果你对el-dialog做了这样的优化.el-dialog{display:flex;flex-direction:column;margin:0!
栗鼠_抚殇·2020-08-08 20:28

vue + elementUi el-dialog中引入vue页面 在父页面访问el-dialog引入页面的方法

遇到一个这样的问题，实际页面中用到dialog，并且引入了其他页面，当然这里用的vue+elementUI如果想要引入页面在弹框每次弹出时进行初始化，如图：但是dialog中子页面只会在父页面加载完后，第一次点击事件时初始化，如果关闭，在打开，实际中页面是存在的，只是隐藏研究了好久，最初想到是用vue$refs实现,在子页面添加init方法发现vm.$refs.方法输出undifined,参考ht
❀溜溜·2020-08-08 20:57

element 的el-dialog 浮层嵌套，第二次弹出的会被遮住

困扰了很久的一个问题，就是用element-ui的浮层组件进行浮层嵌套时候，当子浮层关闭时，父级浮层上面会有一层灰色遮罩层当关闭子级浮层后，父级浮层上面会有一层灰色蒙层解决方式：父级浮层设置:modal-append-to-body="false"属性，同时在子级浮层设置:modal-append-to-body="true"append-to-body属性Element组件之【Dialog对话框
海盗强·2020-08-08 19:40

elementUI弹框form多元素表单问题 - 抛砖篇

疑问3：使用el-dialog组件如何调用？通过上述实践，总结发现还是使用el-dialog组件，比较坑少，直接，出效率！
草巾冒小子·2020-08-08 19:33
上一页 4 5 6 7 8 9 10 11 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他