vue3SeamlessScroll实现列表的无限循环滚动

安装：

npm install vue3-seamless-scroll 

全局部署：main.ts

import vue3SeamlessScroll from 'vue3-seamless-scroll'
app.use(vue3SeamlessScroll)

到页面使用

<template>
<div class="header">
 <vue3-seamless-scroll
      class="seamless-warp scroll"
      :list="plansData.data" //对应循环的数据
      :step="0.8"  //速度
      :hover="true"  //点击是否暂停
      style="width: 100%"
      v-model="isScroll"
    >
 <div class="box" v-for="(item, index) in plansData.data" :key="index">
</div>
 </vue3-seamless-scroll>
</div>
</template>
<script>
import { Vue3SeamlessScroll } from 'vue3-seamless-scroll'
const isScroll = ref(true) //默认true开始滚动
</script>
<style>
.seamless-warp scroll {
  height: 300px;
  width: 100%;
  overflow: scroll;
}
.header {
  height: 100%;
  overflow: hidden;
}
</style>

其它功能可参考利用vue3SeamlessScroll简单实现列表的无限循环滚动，仅需几秒配置_vue3 表格循环滚动-CSDN博客