vue中better-scroll中页面滚动无效的问题，已解决！

最新推荐文章于 2025-06-02 03:56:06 发布

转载最新推荐文章于 2025-06-02 03:56:06 发布 · 2.6k 阅读

本文介绍了一种在Vue项目中解决Better Scroll组件初始化失败的方法。通过使用setTimeout延迟加载，确保DOM元素完全加载后再实例化Better Scroll，从而避免了因DOM未准备好导致的滚动功能失效问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一开始的代码是这样子的，怎么调都无效：

<script>
  import BScroll from 'better-scroll'
    export default{
      name: "CityList",
      mounted(){
         this.scroll = new BScroll(this.$refs.wrapper);
        console.log(this.scroll);
      }
    }
</script>

最后的解决：

<script>
  import BScroll from 'better-scroll'
    export default{
      name: "CityList",
      mounted(){
         setTimeout(()=>{
           this.scroll = new BScroll(this.$refs.wrapper);
          },20)
      }
    }
</script>

转载自：https://www.e-learn.cn/content/qita/786075