在页面内容较多，出现滚动条时使用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. hibernate表关系

    1.一对一 用户表可以查分成两个表,一个userInfo.一个userLogin表 实现方式: (1)使用外键:外键+唯一性约束+非空约束 (2)公用主键:公用主键,从表的主键同时也是外键,来源于主表 ...

  2. 资源:开源Fuzzers工具列表 (以及其它fuzzing工具)

    开源fuzzers‍ / 开源fuzzing工具的最新列表(Fuzzers,没有标准中文翻译,可以理解为模糊测试工具或者模糊器) 如果你知道有需要添加的部分,那么请在这里或在推特上@Peerlyst来 ...

  3. ACM-线段树

    http://blog.csdn.net/libin56842/article/details/8530197 基础可以看上面这篇文章 风格: maxn是题目给的最大区间,而节点数要开4倍,确切的说… ...

  4. java 判断图片的类型

    // 这种方法如果遇到不是图片类型的文件会reader抛异常! public static void main(String[] args) throws IOException { // get i ...

  5. canvas-菜鸟版画布时钟

    这是以前自己练习写的一个画布时钟 <!DOCTYPE html><html lang="en"> <head> <meta charset ...

  6. Arcgis flex 切片地图麻点

    在arcgis server中发布地图切片完成后,有时候在访问地图的时候会出现很多麻点, 其实是你切片的时候没有注意到一些选项.... 默认的切片是PNG8,说到这可能就明白了吧,png8的色彩范围: ...

  7. Android Studio笔记之快捷键

    Android Studio h2{ color: #4abcde; } pre{ background-color: #f8f8f8; border: solid 1px #ccc; border- ...

  8. windows常用命令集锦

    开始→运行→输入的命令集锦 gpedit.msc-----组策略 sndrec32-------录音机 Nslookup-------IP地址侦测器 explorer-------打开资源管理器 lo ...

  9. 【Leetcode】【Easy】Balanced Binary Tree

    Given a binary tree, determine if it is height-balanced. For this problem, a height-balanced binary ...

  10. mysql 省市数据

    CREATE TABLE `province` ( `id` ) DEFAULT NULL, `name` ) DEFAULT NULL ) ENGINE=INNODB DEFAULT CHARSET ...