vue循环滚动字幕组件

以下是使用vue-seamless-scroll实现循环滚动字幕组件的示例代码：

1. 首先，安装vue-seamless-scroll组件：

cnpm install vue-seamless-scroll --save

2. 在需要使用循环滚动字幕的组件中引入vue-seamless-scroll：

import Vue from 'vue'
import VueSeamlessScroll from 'vue-seamless-scroll'

Vue.use(VueSeamlessScroll)

3. 在模板中使用vue-seamless-scroll组件，并传入需要滚动的内容：

<template>
  <div>
    <vue-seamless-scroll :list="scrollList" :speed="30" :interval="2000" :direction="direction">
      <div slot-scope="item">{{ item }}</div>
    </vue-seamless-scroll>
  </div>
</template>

4. 在组件的data中定义需要滚动的内容列表和滚动方向：

export default {
  data() {
    return {
      scrollList: ['字幕1', '字幕2', '字幕3'],
      direction: 'vertical' // 滚动方向，可选值为 'vertical' 或 'horizontal'
    }
  }
}

通过以上步骤，你可以实现一个循环滚动字幕组件。