iView,打开modal时给body添加了样式,在关闭modal时没有移除

发布于 2022-09-11 19:56:08 字数 262 浏览 23 评论 0

在vue项目中使用了iView
iView在打开modal弹窗时,给body增加了样式style="padding-right: 15px; overflow: hidden;"
是为了在打开弹窗时阻止页面滚动
但是关闭modal弹窗时,没有移除这个样式,造成本来有滚动条的页面无法滚动

有一个scrollable属性,但是配置之后打开modal弹窗时,页面也可以滚动了,还是不想在打开弹窗时让页面滚动

请问大家有什么公共处理的方法?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

橘虞初梦 2022-09-18 19:56:08

没有处理过, modal关闭的时候, 这个样式就自动删除了

clipboard.png

clipboard.png

镜花水月 2022-09-18 19:56:08

利用on-visible-change事件,true的时候给body添加一个hiddenclass,flase的时候移除这个class

.hidden {
    padding-right: 15px;
    overflow: hidden;
}
昔日梦未散 2022-09-18 19:56:08

两种方式:
a. 通过将scrollable属性控制, 默认为false 即页面不滚动,无需设置;
b. 通过事件 on-visible-change 来手动修改body样式;

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文