当前位置:   article > 正文

Vue | Element UI Plus 完美解决el-dialog双滚动条、页面抖动问题_element plus 弹窗模态框有滚动条

element plus 弹窗模态框有滚动条

解决因为滚动条隐藏导致的窗口抖动问题:

(添加 :lock-scroll="false" 属性)(无效的话把冒号去掉试试)

  1. <el-dialog class=""
  2. v-model=""
  3. title=""
  4. :lock-scroll="false"
  5. width="800px"
  6. height="400px"
  7. top="10vh"
  8. >

解决双滚动条问题:(无效的话去掉deep)

  1. /* 解决双滚动条 */
  2. :deep(.el-dialog) {
  3. display: flex !important;
  4. flex-direction: column !important;
  5. margin: 0 !important;
  6. position: absolute !important;
  7. top: 50% !important;
  8. left: 50% !important;
  9. transform: translate(-50%, -50%) !important;
  10. overflow-y: auto !important;
  11. overflow-x: auto !important;
  12. max-height: 90vh !important;
  13. }

参考:

http://t.csdnimg.cn/xavOG

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/繁依Fanyi0/article/detail/550078
推荐阅读
相关标签
  

闽ICP备14008679号