vue 文字左右上下循环滚动插件

前几天有个项目需要一个文字左右滑动的效果，为了方便，于是在网上查了一下是否有相关插件，最后还是被我找到一个小插件

首先是安装插件

npm install -s vue-seamless-scroll

插件安装后，在页面中引入

import vueSeamlessScroll from 'vue-seamless-scroll'

components： { vueSeamlessScroll }

html代码

<vue-seamless-scroll :data="webList" :class-option="optionLeft" class="seamless-warp2" :style="`width: ${divWidth}px`">
  <ul class="seamlessItem" :style="`width: ${divWidth}px`">
    <li v-for="item in webList" v-text="item.title">li>
  ul>
vue-seamless-scroll>

js逻辑代码

data: {
  divWidth: 0,
  webList: []
}
computed: {
  optionLeft () {
    return {
      direction: 2,
      limitMoveNum: 2
    }
  }
},
mounted: {
  this.$nextTick(() => { // 在dom渲染完后,再执行动画
    this.divWidth = window.innerWidth;
    this.webList = [
        {
          title: '由于网站升级维护，大赛网站将于10月13日-10月22日期间临时关闭。'
        }, {
          title: '由于网站升级维护，大赛网站将于10月13日-10月22日期间临时关闭。'
        }
      ]
  })
}

css样式

.seamless-warp2 {
  overflow: hidden;
  height: 25px;
  width: 380px;
}
.seamlessItem {
  height: 25px;
  li {
    float: left;
    margin-right: 10px;
    color: #FFFFFF;
  }
}

以上是向左滚动，滚动条数2条
其他方向滚动，或参数，请参考官方文档：https://chenxuan1993.gitee.io/component-document/index_prod#/component/seamless-default