当前位置: 首页 > news >正文

element-ui里message抖动问题

由于element默认屏蔽滚动条,导致取消时弹message时 侧边滚动栏突然回来后引起抖动问题

24621

是由于打开弹窗时出现遮罩层dialog对话框 时引起了元素内容超出自身尺寸 对应的overflow样式内容为hidden,且新建了一个class类内容为增加17 内右边距,当弹框取消时 这些属性消失,所有产生抖动行为 ,如下图

2462111

什么时候会溢出? 内容太长或是其他情况(没遇到过其他情况)

overflow可选值

  1. visible(默认值): 溢出部分将会显示在元素框之外。
  2. hidden: 溢出部分将被切掉,不显示滚动条。
  3. scroll: 溢出部分将被切掉,但会显示滚动条,用户可以滚动查看。
  4. auto: 如果内容太多而无法在元素框内完全显示,则显示滚动条;否则不显示滚动条。

综上,我们只需要在App.vue入口文件里加入如下样式即可

body {overflow: hidden !important;padding-right: 0 !important;
}

至此完美解决上述问题

222

http://www.lryc.cn/news/379924.html

相关文章:

  • Attention系列总结-粘贴自知乎
  • swagger下载文件名中文乱码、swagger导出文件名乱码、swagger文件导出名称乱码、解决swagger中文下载乱码bug
  • 191.回溯算法:组合总和|||(力扣)
  • JupyterLab使用指南(二):JupyterLab基础
  • ubuntu18.04 + openssl + engine + pkcs11+ softhsm2 双向认证测试
  • 【C++】类和对象2.0
  • 【LLM之KG】KoPA论文阅读笔记
  • UI设计速成课:理解模态窗口与非模态窗口的区别
  • 【Linux】基础IO_4
  • C++模板类原理讲解
  • scratch编程03-反弹球
  • postgresql数据库进阶知识
  • 关于HTTP劫持,该如何理解、防范和应对
  • System.Data.OracleClient.OracleException:“ORA-12571: TNS: 包写入程序失败
  • saas产品运营案例 | 联盟营销计划如何帮助企业提高销售额?
  • 模式分解算法-满足3NF的无损且保持函数依赖的分解算法、满足BCNF的无损连接分解算法
  • 荷兰与法国战平,双方能携手出现?
  • 数据可视化实验二:回归分析、判别分析与聚类分析
  • FL论文专栏|设备异构、异步联邦
  • 【Java毕业设计】基于JavaWeb的礼服租赁系统
  • 代码随想录训练营Day 66|卡码网101.孤岛的总面积、102.沉没孤岛、103.水流问题、104.建造最大岛屿
  • 根据状态转移写状态机-二段式
  • PyTorch C++扩展用于AMD GPU
  • Hadoop archive
  • R语言——R语言基础
  • VFB电压反馈和CFB电流反馈运算放大器(运放)选择指南
  • elasticsearch安装(centos7)
  • Java高手的30k之路|面试宝典|精通JVM(二)
  • JVM专题六:JVM的内存模型
  • 学习java第一百零七天