element中dialog出现滚动条记忆功能

最新推荐文章于 2024-09-02 11:16:07 发布
最新推荐文章于 2024-09-02 11:16:07 发布
阅读量965 收藏 2
点赞数 4
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_35695023/article/details/114066238
版权

当Dialog内容过多时会出现滚动条，而当你滚动到一定位置后关闭Dialog，然后再次打开时弹框滚动条仍然保持在上一次关闭前的位置而没有回到顶部。
使用element-ui，dialog中的destroy-on-close属性，关闭时销毁 Dialog 中的元素。这样在每次打开dialog时，滚动条都是在最顶部的。

在这里插入图片描述
在这里插入图片描述

云怎
关注
专栏目录
element Dialog添加滚动条
qq_41742961的博客
11-03 2322
<el-dialog :title="title" :visible.sync="dialogFormVisible" width="900px" v-if="deviceDialog"> <div :style="{height: scrollHeight}" style="overflow-y: auto;overflow-x:hidden" > <el-form :model="form" ref="form" :inline="true" l
Element-ui之ElScrollBar组件滚动条的使用方法
10-18
ElScrollBar 组件是 Element-ui 中用于自定义滚动条样式的组件。下面详细介绍 ElScrollBar 组件的使用方法和原理。 1. 自定义滚动条的使用场景和优势 在开发Web应用时，尤其是在后台管理界面，常会遇到页面内容...
elementUI Dialog内容区域显示滚动条
爱米酱的博客
10-25 4652
【代码】elementUI Dialog内容区域显示滚动条。
element el-dialog 滚动条问题
最新发布
m0_68716504的博客
09-02 861
elementUI在打开dialog的时，页面右侧会出现滚动条，或是页面宽度会缩小，当关闭dialog后又恢复原样，控制台检查后发现当打开dialog时，body元素会有class=el-popup-parent--hidden的类名，关闭dialog后el-popup-parent--hidden类名消失，这应该就是造成页面出现滚动条或是宽度缩小的原因，查了一下资料发现有两种解决办法。
element-ui 对话框 el-dialog 多内容时显示对话框滚动条
陌小白的博客
11-10 6238
element-ui 对话框 el-dialog 多内容时显示对话框滚动条 <el-dialog :visible.sync="dialogTableVisible" class="roll-dialog"> </el-dialog> .roll-dialog .el-dialog__body { padding: 3px 30px; overflow-y: auto; height: calc(100vh - 140px); } ...
element-ui—— el-dialog: 让中间出现滚动条
qq_43201350的博客
06-08 2266
/deep/ .el-dialog { height: 870px; } /deep/ .el-dialog__body { overflow-y: auto; height: 680px; }
Vue | Element UI Plus 完美解决el-dialog双滚动条、页面抖动问题
m0_59074557的博客
03-12 2360
(添加 :lock-scroll="false" 属性)（无效的话把冒号去掉试试）解决双滚动条问题：（无效的话去掉deep）
vue element在dialog添加滚动条
05-27
要在 Vue Element 的 Dialog 中添加滚动条，你可以使用 `el-dialog` 组件的 `body-style` 属性，并设置 `overflow-y: auto` 样式，示例代码如下： ```html <el-dialog title="Dialog Title" :visible=...
element UI dialog 竖向加滚动条
07-07
要 Element UI 的对话框（Dialog）中添加垂直动条，你可以使用 CSS 样式来实现。以下是一种实现方法： 首先，在对话的内容区域（dialog body）中添加一个定...这样就可以在 Element UI 的对话框中实现垂直滚动条了。
el-dialog 中滚动条的样式
08-15
要修改 el-dialog 中滚动条的样式，你可以通过自定义 CSS 来实现。以下是一种可能的方法： 1. 首先，给 el-dialog 设置一个自定义类名，例如 "custom-dialog"： ```html <el-dialog class="custom-dialog"></el-...
Element UI中el-dialog中内容超出自定义滚动条
卷发头的鲁智深的博客
03-13 1万+
dialog内容超出显示滚动条
el-dialog中内容自定义滚动条
风水道人
10-20 1834
el-dialog中内容自定义滚动条
Element UI Dialog 对话框改成固定高度，超出部分滚动条滚动
热门推荐
weixin_44702139的博客
05-19 1万+
问题描述 elememt ui 中的el-dialog对话框如果内容过多高度会被无限拉长。要将其设置成固定高度，此处我设置的是页面总高度的80%，内容过多时在对话框内出现滚动条，具体代码如下： 但是这样设置会造成高度不能根据内容自适应，始终是80% // 内容 <template> <el-dialog :title="title" :visible.sync="dialogVisible" class="showAll_dialog"
element中dialog出现滚动条记录位置问题
qq2276031的博客
05-12 3266
element中dialog出现滚动条记录位置问题 //弹窗出现滚动条的时候滚动到最底下，下次在点开的时候还在最底下，可以通过以下方式解决 <el-dialog :title="formTitle" :visible.sync="dialogFormVisible" :lock-scroll="false" //主要是这个属性 :append-to-body="true" //跟这个属性 :close-on-click-modal="false"
Dialog 窗口 滚动条
weixin_30767835的博客
09-25 1557
本人用Dialog做了一个弹出框，又在弹出框内展示的是树形结构treegrid。 但是在树形结构数据很多的时候，窗口并不会显示右边的滚动条，导致下面的都看不到。 经过研究发现dialog是在数据足够多的时候自动显示滚动条，但是我内置的treegrid height开始设置的小于了dialog 设置的 height，足够多数据不能触发dialog窗口； 结论是：把内置的树形结构不设置...
el-dialog窗口添加滚动条
Gpointy的博客
09-15 1744
【代码】el-dialog窗口添加滚动条。
el-dialog 不想让弹窗外层滚动，只滚动弹窗内容
qq_36202011的博客
05-16 992
原el-dialog设置了margin: 15vh auto 50px，如果设置高度+15vh+50px > 100vh ，则会出现滚动条。就设置dialog的高度为100vh以内，发现设置为79vh以上还是会使body滚动，打开控制台发现，首先body垂直能滚动，一定是高度超出100vh了，找来找去无果，只能动自己的脑子了。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值