位置: IT常识 - 正文
Vue3无缝滚动----vue3-seamless-scroll(vue无线滚动)
编辑：rootadmin推荐整理分享Vue3无缝滚动----vue3-seamless-scroll(vue无线滚动)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:vue设置页面滚动,vue实现无缝轮播,vue实现无缝轮播,vue3无缝滚动插件,vue无线滚动,vue3无缝滚动插件,vue3无缝滚动插件,vue3无缝滚动插件,内容如对您有帮助，希望把文章链接给更多的朋友！
在一些大屏可视化项目中，经常会用到滚动的样式。
安装npm install vue3-seamless-scroll --savemain.js中引入import vue3SeamlessScroll from 'vue3-seamless-scroll';const app = createApp(App);app.use(vue3SeamlessScroll)使用 <vue3-seamless-scroll hover-stop="true" :list="listData" hover="true" step="0.3"> <div v-for="(item, index) in listData" :key="index" class="item" style="padding: 10px; margin: 5px; font-size: 14px"> <span v-for="(value, key, ind) in item" :key="ind" class="spanClass">{{ value }}</span> </div> </vue3-seamless-scroll>组件配置list
无缝滚动列表的数据，组件内部使用列表长度。（注意：这也是这个组件的不足之处，在项目中不支持动态更改其长度，一旦初始化只可以更改其内容，不可以更改其长度）
type: Array required: true
v-model
通过v-model控制动画滚动和停止，默认开始滚动。
type: Boolean, default: true, required: false
direction
控制滚动方向，可选值up、down、left、right
type: String, default: “up”, required: false
isWatch
开启数据更新监听
type: Boolean, default: true, required: false
hover
是否开启鼠标悬停
type: Boolean, default: false, required: false
count
动画循环次数，默认无限循环
type: Number, default: “infinite”, required: false
limitScrollNum
开启滚动的数据量，只有列表长度大于等于该值才会滚动
type: Number, default: 5, required: false
step
步进速度
type: Number, required: false
指南在这里
上一篇：从观景台俯瞰格雷梅，格雷梅国家公园，土耳其卡帕多西亚省 (© Anton Petrus/Getty Images)(观景台俯视图)
下一篇：【编译原理】 实验一:词法分析器的自动实现(Lex词法分析)(编译原理第三版课后答案)
