vue等框架对Tabs、Moda等设置固定高度后没有滚动条问题
更新时间：2023年05月13日 11:13:37 作者：鼠年大吉
这篇文章主要介绍了vue等框架对Tabs、Moda等设置固定高度后没有滚动条问题,解决方法很简单，只需要一行简短代码就可以解决，下面小编给大家详细讲解，需要的朋友可以参考下
vue等框架对Tabs、Moda等设置固定高度后没有滚动条
当弹窗不设置高度时，界面会根据内容自动扩充高度，内容过长时会非常难看，需要设置固定高度，当超出这个高度后悔出现滚动条。效果如下图：
其实很简单，在你需要控制高度的地方加上一行代码
style="height:400px;overflow-y:auto;overflow-x:hidden;"
以下为我加的位置：
是不是满足您的需求？
补充：vue 解决无法设置滚动位置的问题
问题描述
在实现锚点定位的时候发现无法设置滚动条的位置。
在Vue中，使用 document.body.scrollTop=952 无法设置滚动条的高度。
document.body.scrollTop一直是0
原因
因为vue的页面指定了DTD，即指定了DOCTYPE时，使用document.documentElement。
页面没有DTD，即没指定DOCTYPE时，使用document.body。
解决方案
document.documentElement=956
2018年10月10号新增
上面仅仅是说这个页面的滚动条高度的设定，当我页面内的一个div的滚动条设定他的高度 如下解决方案
var anchor = this.$el.querySelector('.message-list')
this.$nextTick(() => {
document.querySelector('.message-list').scrollTop = anchor.scrollHeight
})这个解决方案在我做ng的时候又出现过类似的问题，我前大佬告诉我的 ，当时只是为了解决问题并没有了解其原理，复制进来就过去了。
现在做vue了，才知道哦，为什么要这样写，所以说项目太赶，只是为了完成任务，对个人能力并没有提升，做完了就过了， 还要解决其他的bug，其他的任务，现在能够静下来在工作过程中学习+进步，对个人的发展才是好的。工作不仅仅是工作完成任务，是一个自己发现自身问题，提升能力和对自己的技术实操实践的过程。
到此这篇关于vue等框架对Tabs、Moda等设置固定高度后没有滚动条的文章就介绍到这了,更多相关vue设置固定高度没有滚动条内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要为大家详细介绍了如何在vue中封装axios请求并集中管理,w文中的示例代码讲解详细,具有一定的参考价值,有需要的小伙伴可以了解下2023-10-10
Vue3项目pc端浏览器样式正常但移动端部分样式失效问题的解决方法
这篇文章主要介绍了Vue3项目pc端浏览器样式正常但移动端部分样式失效问题的解决方法,文中通过图文讲解的非常详细,具有一定的参考价值,需要的朋友可以参考下2024-07-07
这篇文章主要给大家介绍了关于Vue中extends继承和组件复用性的相关资料,组件(Component)是Vue.js最强大的功能之一,组件可以扩展HTML元素,封装可重用的代码,需要的朋友可以参考下2023-11-11
这篇文章主要介绍了Vue2中的过滤器filter使用及注意说明，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-09-09
这篇文章主要为大家详细介绍了Vue实现简易记事本功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-11-11
在现代前端开发的世界中,Vue 3 已然成为了一个备受喜爱的框架,而 Vite 作为一个新兴的构建工具,以其极高的效率和简捷的配置方式席卷了开发者圈,本文我们将一步一步展示如何使用 Vite 构建一个 Vue 3 项目,从创建项目到最后的构建阶段,需要的朋友可以参考下2024-07-07
这篇文章主要介绍了Vue项目如何打包成移动端APP,本文通过图文示例相结合给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧2023-12-12
本文主要介绍了vant4 封装日期段选择器的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-03-03
这篇文章主要介绍了vue vant中picker组件的使用说明，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-11-11
这篇文章主要介绍了vue项目webpack中配置src路径别名及使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
最新评论