基于vue实现循环滚动列表功能

注意：需要给父容器一个height和:data='Array'和overfolw:hidden;左右滚动需要给ul容器一个初始化 css width。
先来介绍该组件的用法：
1.安装命令：

cnpm install vue-seamless-scroll --save

2.main.js文件中作为全局组件引入

import scroll from 'vue-seamless-scroll'

Vue.use(scroll)

css代码：

computed: {
    defaultOption() {
      return {
        step: 0.6, // 数值越大速度滚动越快
        hoverStop: true, // 是否开启鼠标悬停stop
        direction: 1, // 0向下 1向上 2向左 3向右
        waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
      }
    }
  }

效果如下：

到此这篇关于基于vue实现循环滚动列表功能的文章就介绍到这了,更多相关vue循环滚动列表内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！