无缝滚动 vue-seamless-scroll

运用与数据大屏等需要无缝衔接的功能效果

安装

npm 安装 ：

npm install vue-seamless-scroll --save

yarn 安装：

yarn add vue-seamless-scroll

全局注册：

import Vue from "vue";
import scroll from "vue-seamless-scroll";
Vue.use(scroll);

局部注册：

注意这里分 vue2 和 veu3 注册

vue2:

import vueSeamless from "vue-seamless-scroll";
export default {
  components: {
    vueSeamless,
  },
};

使用：

使用时给盒子增加宽高

<vueSeamless :data="listData" class="gaotext" :class-option="classOption">
  <view class="" v-for="item in listData" :key="item.id">{{ item.name }} </view>
</vueSeamless>

export default {
  data() {
  	listData：[],           // 后端数据
  	classOption：{
   			step: 0.5,       // 数值越大速度越快
        	direction: 1,    // 往上滚动
     	   limitMoveNum: 1, // 1条数据开启无缝滚动
  		}
  }
}