在页面内容较多，出现滚动条时使用element组件里的dialog组件，当关闭dialog组件的同时弹出Message消息提示时，Message会抖动一下。

在页面有滚动条的情况先打开dialog时，dialog会给页面的<body></body>添加一个class类名和一个style样式，如图：

overflow这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，用户代理都会提供一种滚动机制

所以当dialog关闭而Message弹出的瞬间，body由于失去overflow属性和padding-right属性页面宽度会小17px，因为Message是居中的所以会往左面抖一下

解决：

　　在app.vue页面中写入

　　body {
　　　　overflow-y: auto !important;　　//只写这个属性，会出现两个滚动条
　　　　padding-right: 0 !important;　　//只写这个属性，当你打开dialog时，由于padding-right=0；页面宽度会大17px；dialog会抖动
　　}

element组件dialog关闭时Message消息提示抖动问题的更多相关文章

  1. 在vue项目中的main.js中直接使用element-ui中的Message 消息提示、MessageBox 弹框、Notification 通知

    需求来源:向后台请求数据时后台挂掉了,后台响应就出现错误,不做处理界面就卡住了,这时需要在main.js中使用axios的响应拦截器在出现相应错误是给出提示.项目使用element-ui,就调用里面的 ...

  2. Message 消息提示

    常用于主动操作后的反馈提示.与 Notification 的区别是后者更多用于系统级通知的被动提醒. 基础用法 从顶部出现,3 秒后自动消失. Message 在配置上与 Notification 非 ...

  3. element——message消息提示

    官方文档:http://element-cn.eleme.io/#/zh-CN/component/message 简单的用法,一句代码搞定.类型有success/warning/info/error ...

  4. 关于winform窗体关闭时弹出提示框，选择否时窗体也关闭的问题

    在窗体中有FormClosing这个事件,这个事件是在窗体关闭时候运行的.如果要取消某个事件的操作,那么就在该事件中写上e.Cancel=true就能取消该事件,也就是不执行该事件.所以,你要在窗体关 ...

  5. 【C#】无损转换Image为Icon 【C#】组件发布：MessageTip，轻快型消息提示窗 【C#】给无窗口的进程发送消息 【手记】WebBrowser响应页面中的blank开新窗口及window.close关闭本窗体 【手记】调用Process.EnterDebugMode引发异常：并非所有引用的特权或组都分配给呼叫方 【C#】DataRowState演变备忘

    [C#]无损转换Image为Icon 如题,市面上常见的方法是: var handle = bmp.GetHicon(); //得到图标句柄 return Icon.FromHandle(handle ...

  6. ymPrompt.js消息提示组件

    转载:https://www.cnblogs.com/linzheng/archive/2010/11/15/1878058.html 使用说明: 1.在页面中引入ymPrompt.js.如:< ...

  7. 关于Element对话框组件Dialog在使用时的一些问题及解决办法

    Element对话框组件Dialog在我们的实际项目开发中可以说是一个使用频率较高的组件,它能为我们展示提示的功能,如:业务模块提交前展示我们曾经输入或选择过的业务信息,或者展示列表信息中某项业务的具 ...

  8. 封装Vue Element的dialog弹窗组件

    我本没有想着说要封装一个弹窗组件,但有同行的朋友在问我,而且弹窗组件也确实在项目开发中用的比较多.思前想后,又本着样式统一且修改起来方便的原则,还是再为大家分享一个我所封装的弹窗组件吧. 其实,并不是 ...

  9. 【C#】组件发布：MessageTip，轻快型消息提示窗

    -------------201610212046更新------------- 更新至2.0版,基本完全重写,重点: 改为基于原生LayeredWindow窗体和UpdateLayeredWindo ...

随机推荐

  1. 如何给swing加上alt+x和ctrl+x快捷键

    1.给菜单栏上的菜单alt+x快捷键非常简单: private JMenu helpInfo = new JMenu("帮助"); helpInfo.setMnemonic(Key ...

  2. setInterval()设置页面5，4，3，2，1秒后跳转

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. hibernate的各种保存方式的区别 (save,persist,update,saveOrUpdte,merge,flush,lock)

    hibernate的保存hibernate对于对象的保存提供了太多的方法,他们之间有很多不同,这里细说一下,以便区别:一.预备知识:在所有之前,说明一下,对于hibernate,它的对象有三种状态,t ...

  4. tomcat server 报错之 More than the maximum allowed number of cookies

    More than the maximum allowed number of cookies EVERE: Error processing request java.lang.IllegalArg ...

  5. java常用API之Calendar类

    Calendar是日历类,该类将所有可能用到的时间信息封装为静态成员变量,方便获取. Calendar为抽象类,由于语言敏感性,Calendar类在创建对象时并非直接创建,而是通过静态方法创建,将语言 ...

  6. 10th week task -1

    1:For each ... inFor...in ExamplesFor...of 对以上的内容进行 Examples和Explanation (1)For...in 以任意顺序遍历一个对象的可枚举 ...

  7. Android 使用RecyclerView优雅实现悬浮标题通讯录

    项目地址:https://github.com/hgDendi/ContactsList 界面概览: ContactsListDemo ContactsListDemo2 概要 如图,主要简单划分为两 ...

  8. git 无法忽略Android Studio 生成的 .idea目录解决办法

    在Android Studio中导入了别的人Gradle项目,产生了 .idea文件夹, 然后git 发现了这个变动,修改了 .gitignore不起作用,仍然不能忽略这个文件夹 在项目目录里面 右键 ...

  9. matlab练习程序（Ritter‘s最小包围圆）

    原始算法是sphere,我这里简化为circle了. Ritter's求最小包围圆为线性算法,因为非常简单,所以应用非常广泛. 该算法求出的圆比最优圆大概会大个5%到20%左右,求最优圆应该可以用Bo ...

  10. 获取select下拉框的value以及文本内容

    select下拉框在项目开发中是经常用到的,特别是在联级菜单方面的应用更为广泛.但是,对于一些初学者来说,如何获取下拉框子节点option的value值和文本内容,还是有一点难度的.其他的就不说了,现 ...