解决移动端scrollTo({behavior: “smooth“})滑动效果失效的问题

最新推荐文章于 2024-02-28 11:02:30 发布

目标达成

最新推荐文章于 2024-02-28 11:02:30 发布

阅读量6.9k

点赞数 3

分类专栏：兼容 JavaScript 文章标签：移动端scrollTo方法 scrollTo滑动效果

本文链接：https://blog.csdn.net/liucai1018/article/details/116795115

版权

10 篇文章 0 订阅

订阅专栏

2 篇文章 0 订阅

订阅专栏

js自带的scrollTo方法可以设置动画，滚动的效果，代码在电脑上正常，但是在手机上的时候就没有smooth的滑动效果了，只能僵硬的跳到某个位置，类似scrollTop赋值的效果，这里从一个博客看到的一个解决办法，试了下确实可以，所以记录一下：

首先安装这个插件：smoothscroll-polyfill

npm install smoothscroll-polyfill --save

然后引入并在组件创建的时候调用下这个方法：比如mounted中

import smoothscroll from 'smoothscroll-polyfill'

mounted() {
    // 解决移动端 scrollTo 的 behavior: "smooth" 无效的问题
    smoothscroll.polyfill()
}

然后后面代码中有调用scrollTo()方法就有效果了，神奇

关注