element-plus:Dialog 对话框在有滚动条的页面会抖动

简介: element-plus:Dialog 对话框在有滚动条的页面会抖动

image.png

查看元素发现,动态增加了一个style标签

<body class="el-popup-parent--hidden" style="width: calc(100% - 15px);">
</body>

解决方法

增加一个参数lock-scroll="false" ,解除在 Dialog 出现时 body 滚动锁定

<el-dialog :lock-scroll="false">
</el-dialog>

参考

https://element-plus.gitee.io/zh-CN/component/dialog.html

[Style] el-popup-parent–hidden 会携带 width: calc(100% - 8px) 样式 #9937


相关文章
|
移动开发 前端开发 iOS开发
记录一下前端H5的复制功能在ios端的兼容性问题
记录一下前端H5的复制功能在ios端的兼容性问题
1562 0
element-ui 里 el-popover 位置发生偏移
element-ui 里 el-popover 位置发生偏移
2892 0
|
3月前
|
人工智能 安全 API
5分钟搭建专属AI知识库!OpenClaw阿里云/本地部署+飞书智能知识库实战+百炼API配置指南
在2026年的AI生态中,单纯的对话模型早已无法满足深度使用需求,AI+私有知识库才是真正能落地、能复用、能持续进化的核心形态。无论是个人沉淀经验、团队共享文档、企业管理技术资料,还是把OpenClaw训练成专属智能助手,一套可问答、可检索、可溯源的AI知识库,都能让效率呈指数级提升。
3457 5
|
前端开发
【UI】 elementui的dialog弹窗打开时CSS的BUG | 滚动条消失bug
【UI】 elementui的dialog弹窗打开时CSS的BUG | 滚动条消失bug
905 0
Threejs用切线实现模型沿着轨道行驶
这篇文章详细介绍了如何使用Three.js让一个模型沿着预定的曲线路径移动,并保持模型的方向始终沿着路径的切线方向,提供了实现这一效果的具体代码和步骤。
1080 1
Threejs用切线实现模型沿着轨道行驶
|
前端开发 JavaScript 开发者
利用 el-select 和 el-tree 实现树形结构多选框联动功能
本文详细介绍了如何使用ElementUI中的el-select下拉选择器和el-tree树形控件来实现多功能联动选择器,包括多选、删除、搜索、清空选项等功能。通过树形控件展示复杂的层级结构,用户可以通过下拉选择树形节点,实时搜索节点,且支持批量选择和删除功能。文中提供了完整的HTML、JavaScript和CSS代码实现,帮助开发者快速集成此功能。
6479 0
利用 el-select 和 el-tree 实现树形结构多选框联动功能
echarts的xAxis和yAxis——x轴y轴以及网格线的详细配置
echarts的xAxis和yAxis——x轴y轴以及网格线的详细配置
7363 0
|
存储 JavaScript 安全
组件通信——provide 和 inject 实现爷孙组件通信
组件通信——provide 和 inject 实现爷孙组件通信