解决再次打开el-dialog里面el-form的滚动条不置顶

最新推荐文章于 2024-05-16 12:00:22 发布
最新推荐文章于 2024-05-16 12:00:22 发布
阅读量1.1k 收藏 1
点赞数 2
文章标签： elementui 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43513818/article/details/123568772
版权

因为再次打开带有滚动条的dialog，滚动条会回到上次打开的位置，而不是置顶。
Dialog 自身是否插入至 body 元素上。嵌套的 Dialog 必须指定该属性并赋值为 true
Dialog 自身是否插入至 body 元素上。嵌套的 Dialog 必须指定该属性并赋值为 true，我也不清楚具体啥原因，有时间再具体分析

qq_43513818
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
给行内表单添加滚动条
qq_44802808的博客
04-09 3050
写项目中遇到的一些不熟悉的问题，记录下来 如上图所示，表单项比较多，然后就被撑下来了，本来想着设置一个横向的滚动条，但一直没有成功，设置的overflow-x： scroll，但出来的一直是竖向滚动条，表单项依旧被撑下来了 后来在el-form上设置了一个不换行的属性，就解决了这个问题 ...
element 解决dialog滚动条置顶问题
weixin_45289656的博客
12-28 2092
弹窗出现滚动条的时候滚动到最底下， 下次在点开的时候还在最底下，可以通过以下方式解决 <el-dialog title="formTitle" :lock-scroll="false" //主要是这个属性 :append-to-body="true" //跟这个属性 ></el-dialog> ...
解决el-dialog弹框出现后页面滚动条可滚动问题
最新发布
weixin_43923808的博客
05-16 450
在methods方法里写。
element中dialog出现滚动条记录位置问题
qq2276031的博客
05-12 3066
element中dialog出现滚动条记录位置问题 //弹窗出现滚动条的时候滚动到最底下，下次在点开的时候还在最底下，可以通过以下方式解决 <el-dialog :title="formTitle" :visible.sync="dialogFormVisible" :lock-scroll="false" //主要是这个属性 :append-to-body="true" //跟这个属性 :close-on-click-modal="false"
vue-element 对话框关闭以后打开，让滚轮回到最顶端
Zhong_zong_ming的博客
11-28 848
【代码】vue-element 对话框关闭以后打开，让滚轮回到最顶端。
vue element 弹框打开滚条回到顶部
Khun_HWJ的博客
02-21 923
vue element 弹框打开滚条回到顶部
基于element-ui对话框el-dialog初始化的校验问题解决
10-14
因此，再次打开对话框时，之前设置的校验规则（如`rules`属性）仍然有效，可能导致不必要的初始校验。 解决这个问题有几种常见的策略： 1. **使用`v-if`指令**：将`el-dialog`包裹在`v-if`中，确保在对话框关闭时...
element ui 对话框el-dialog关闭事件详解
08-27
下面小编就为大家分享一篇element ui 对话框el-dialog关闭事件详解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
解决vue中el-tab-pane切换的问题
10-15
3. **关闭弹框时重置状态**：在关闭`el-dialog`的事件处理函数中，将`activeName`重置为默认值，确保下次打开时从新状态开始。 ```javascript methods: { closeDialog() { this.activeName = 'second'; // 将...
vue简单实现滚动条
pingfanblog
01-05 1911
背景：产品提了一个需求在一个详情页，一个form表单元素太多了，需要滚动到最下面才能点击提交按钮，很不方便。他的方案是，加一个滚动条，这样可以直接拉到最下面。优化：1、支持滚动条，这样方便快速往下拉2、点击提交按钮可以悬浮起来，这样随时都能修改完提交，不用拉到最底下。接下来就简单案例实现一下。直接用vue中的组件来实现这个小需求。右侧有下拉框、右下角固定住提交按钮即可。最终实现的效果图如下。
vue elementUI 对话框Dialog 打开后滚条回到顶部
progrmmmm的博客
11-29 2905
正常情况下网页虽然不会显示滚动条了,但是不会回到顶部. 1.点击弹出对话框的标签是a标签,而且加了href,去掉href就可以了.
el-dialog被挡住了，不在最高层，z-index：999无效
Salt_NaCl的博客
02-14 2647
在dialog的组件内加上这段代码 :append-to-body=“true”；或者:modal-append-to-body=“false” 即可解决
vue el-dialog 点击之后滚动条回到顶部
xuxingyuan_的博客
12-19 4901
vue el-dialog 点击之后滚动条回到顶部 记录你当前滚动条的位置 <el-dialog :title="baseTitle" :visible.sync="visible" :before-close="cancelHandle" :close-on-click-modal="false" width="760px" :lock-scroll="false" :append-to-...
el-dialog 打开滚动到顶部_移动端开发——关于局部区域设置滚动的总结 | 实战系列...
weixin_39870092的博客
12-01 843
在移动端开发的时候经常会碰到区域滚动的需求，当然实现起来也是非常简单的，给需要滚动的元素定高然后添加一个overflow-y:scorll自然就可以滚动了，但是添加这个属性之后，使用chrome或者其他浏览器工具调试时是支正常的，但是到手机上时滚动效果就十分的奇怪，滚动会让人感觉有卡顿感。这个时候使用一个属性就可以解决这个问题。-webkit-overflow-scrolling:touch，这个...
el-dialog 打开滚动到顶部_Axure 常用交互案例-返回顶部
weixin_36018748的博客
12-18 844
返回顶部的功能是我们在设计原型时很常见的功能之一，具体表现为：1、页面可进行滚动2、页面滚动时返回顶部按钮不随着页面滚动3、点击按钮页面返回到顶部。原型演示可以点击查看：https://a1ivai.axshare.com我们一起来看看根据上述的表现，要怎么制作这个案例1、画出页面展示图首先，需要打开Axure软件，并在画板上画出整个页面的展示图，即网页的整体画面。这里用截图演示，大家根据实际需要...
el-dialog有滚动条，第一次打开滚动到底部，关闭，再次打开还在底部
qq_45894929的博客
12-10 2866
问题： el-dialog有滚动条，第一次打开滚动到底部，关闭，再次打开还在底部 解决： 使用append-to-body=“true” Dialog 自身是否插入至 body 元素上。嵌套的 Dialog 必须指定该属性并赋值为 true 问题： 使用append-to-body="true之后，dialog中自己加类名写的样式不生效 解决： 将样式改为全局样式 ...
ElementUI表格滚动条位置重置
NuoYan3327的博客
12-10 3580
在使用ElementUI时使用表格组件时遇到了一个问题，当我在弹出层中嵌套使用表格组件时如果我的表格内容过长出现滚动条时，我把滚动条拖放到中间位置后关闭这个弹出层，当我下次重新打开时这个表格的滚动条位置仍然保留了上次退出时的位置，导致了画面没有显示最初始的效果。 这个问题可能在表格与其他组件多重嵌套的情况下会复现，想让表格下方或者右方的滚动条位置复原其实也很简单，首先...
el-dialog里面div加滚动条
05-12
你可以在 `el-dialog` 的 `bodyStyle` 属性中设置一个固定高度和 `overflow-y` 属性为 `auto` 的样式，这样就能让弹窗内容超出弹窗高度时自动生成纵向滚动条了。具体可以参考以下代码： ```html <template> <el-dialog title="Dialog Title" :visible.sync="dialogVisible" :body-style="{ height: '400px', overflowY: 'auto' }" :before-close="handleBeforeClose" > <div> <!-- 这里是内容 --> </div> </el-dialog> </template> ``` 在上述代码中，我们将 `bodyStyle` 属性设置为一个对象，该对象包含一个 `height` 属性和一个 `overflowY` 属性。`height` 属性设置为弹窗的高度，`overflowY` 属性设置为 `auto`，这样就能让内容超出高度时自动生成纵向滚动条了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值