资讯专栏INFORMATION COLUMN

vue 解决无法设置滚动位置的问题

番茄西红柿 / 3325人阅读

摘要:问题描述在实现锚点定位的时候发现无法设置滚动条的位置。在中,使用无法设置滚动条的高度。一直是原因因为的页面指定了,即指定了时,使用。工作不仅仅是工作完成任务,是一个自己发现自身问题,提升能力和对自己的技术实操实践的过程。

问题描述

在实现锚点定位的时候发现无法设置滚动条的位置。

在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,其他的任务,现在能够静下来在工作过程中学习+进步,对个人的发展才是好的。工作不仅仅是工作完成任务,是一个自己发现自身问题,提升能力和对自己的技术实操实践的过程。

 

此随笔乃本人学习工作记录,如有疑问欢迎在下面评论,转载请标明出处。

如果对您有帮助请动动鼠标右下方给我来个赞,您的支持是我最大的动力。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1746.html

相关文章

  • Vue 实践过程中几个问题

    摘要:前言本篇是我在使用过程中,遇到的几个小问题和之前不了解的东西,记录下来,希望能够帮助各位踩坑。小结上面就是我分享的几个小问题,希望大家看了能够有所收获另明年准备去上海,如果小伙伴的公司有坑,可以联系一下我。 前言 本篇是我在使用vue过程中,遇到的几个小问题和之前不了解的东西,记录下来,希望能够帮助各位踩坑。如果喜欢的话可以点波赞,或者关注一下,希望本文可以帮到大家。 本文首发于我的个...

    DevTalking 评论0 收藏0
  • Web前端开发过程踩过坑以及一些小方法技巧(持续更新)

    摘要:一上浏览器使用不允许事件代理到上选择器以上绑定可能会出现点击失效的情况。对于,如果工具是以下版本,在中加入以下代码以上的版本加入以下代码八开发对于文件的处理问题。解决方法有给元素设置绝对定位即可。元素换成内联元素,如。 一、iOS上浏览器使用jQuery不允许事件代理到document上 $(document).on(click, 选择器, function(){}); 以上绑定可能...

    arashicage 评论0 收藏0
  • Web前端开发过程踩过坑以及一些小方法技巧(持续更新)

    摘要:一上浏览器使用不允许事件代理到上选择器以上绑定可能会出现点击失效的情况。对于,如果工具是以下版本,在中加入以下代码以上的版本加入以下代码八开发对于文件的处理问题。解决方法有给元素设置绝对定位即可。元素换成内联元素,如。 一、iOS上浏览器使用jQuery不允许事件代理到document上 $(document).on(click, 选择器, function(){}); 以上绑定可能...

    binta 评论0 收藏0
  • Web前端开发过程踩过坑以及一些小方法技巧(持续更新)

    摘要:一上浏览器使用不允许事件代理到上选择器以上绑定可能会出现点击失效的情况。对于,如果工具是以下版本,在中加入以下代码以上的版本加入以下代码八开发对于文件的处理问题。解决方法有给元素设置绝对定位即可。元素换成内联元素,如。 一、iOS上浏览器使用jQuery不允许事件代理到document上 $(document).on(click, 选择器, function(){}); 以上绑定可能...

    张春雷 评论0 收藏0
  • 基于better-scrollvue滚动组件

    摘要:让用户可以滚动页面。事件中拿到想要的后浏览器已经隐藏地址栏和工具栏,放开插件滚动。发现派发的方法在父组件中监听后获取位置参数的效果不太好必须要手指贴着滑动才可以这个设置为可以实时派发滚动事件和位置参数其他坑点待发现欢迎大佬一起交流 写在前面 由于最近一个移动端项目中许多地方有滚动需求, 横向,纵向的都有,所以就基于better-scroll封装了一个通用的滚动组件,期间也踩了一些坑,有...

    xiaotianyi 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<