vue3中使用vue3-scroll-seamless插件

1、插件库官网地址：

https://xiaofulzm.github.io/vue3-scroll-seamless/

2、下载依赖。

npm install vue3-scroll-seamless --save

3、组件中使用。

   <vue3ScrollSeamless
          ref="vueSeamlessScroll"
          :data="list"
          :classOptions="classOptions"
          class="scroll-wrap"
          @mousewheel.native="handleScroll"
        >
        /** 你需要滚动的内容 **/
           <van-cell :border="false" v-for="item of list"> </van-cell>
        </vue3ScrollSeamless>
  
// 插件的配置项。
const classOptions = reactive({
  step: 0.5, // 滚动速度
  limitMoveNum: list.value.length, // 循环的列表数据
  hoverStop: false, // 这个是鼠标点击后停止，我这里不需要所以关掉了。
  openWatch: true, // 开启数据实时监控刷新dom
  direction: 1, // 向下滚动，详情看文档。
  singleHeight: 0,
});

// 样式：
 .scroll-wrap {
    // overflow: hidden;
    height: 100%;
  }

注意：这个插件会默认将列表数据渲染两遍，因此会有滑动到底部会有空白的情况，我这边差了好多资料没有找到解决办法
有设置他下边子元素display:none的办法，但是页面上还是会有空白页的情况。
我的最后解决办法是，这个整块的元素设置了高度，然后scroll-wrap设置了百分百，这样他滑动到底部就不会有存在的空白页。