vue 锚点跳到指定位置不生效 scrollTop

产品加了个需求,页面锚点跳到对应的位置:

要是jquery写的 id="hh", <a href="#hh"></a>就完事了;但这个是vue写的

document.querySelector('.page').scrollTop = 500

不滚动,

this.$nextTick(() => {

    document.querySelector('.page').scrollTop = 500

});

还是不滚动。感觉阴沟里翻船了!

解决办法,首先要看滚动是在那个元素上发生的

右击元素,选择存储为全局变量

控制台就会出现如下

temp2.scrollTop = 0 ,无论页面怎么滚动,值都为0,说明滚动不在这个元素上发生,所以 document.querySelector('.page').scrollTop = 500不生效

后面找了好几个都,都是零

document.body.scrollTop也不行

高光时刻来了

document.documentElement.scrollTop  的值终于不为零了

document.documentElement.scrollTop = 目标offsetTop  搞定

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容