单行停顿时间

Vue3.0 无缝滚动组件展示数据第1条1743679966918

Vue3.0 无缝滚动组件展示数据第2条1743679966918

Vue3.0 无缝滚动组件展示数据第3条1743679966918

Vue3.0 无缝滚动组件展示数据第4条1743679966918

Vue3.0 无缝滚动组件展示数据第5条1743679966918

Vue3.0 无缝滚动组件展示数据第6条1743679966918

Vue3.0 无缝滚动组件展示数据第7条1743679966918

Vue3.0 无缝滚动组件展示数据第8条1743679966918

Vue3.0 无缝滚动组件展示数据第9条1743679966918

Vue3.0 无缝滚动组件展示数据第1条1743679966918

Vue3.0 无缝滚动组件展示数据第2条1743679966918

Vue3.0 无缝滚动组件展示数据第3条1743679966918

Vue3.0 无缝滚动组件展示数据第4条1743679966918

Vue3.0 无缝滚动组件展示数据第5条1743679966918

Vue3.0 无缝滚动组件展示数据第6条1743679966918

Vue3.0 无缝滚动组件展示数据第7条1743679966918

Vue3.0 无缝滚动组件展示数据第8条1743679966918

Vue3.0 无缝滚动组件展示数据第9条1743679966918

<template>
  <div class="scroll">
    <vue3-seamless-scroll :list="list" :singleHeight="30" :singleWaitTime="3000">
      <div class="item" v-for="(item, index) in list" :key="index">
        <span>{{ item.title }}</span>
        <span>{{ item.date }}</span>
      </div>
    </vue3-seamless-scroll>
  </div>
</template>
<script>
import { defineComponent, ref } from "vue";

export default defineComponent({
  name: "App",
  setup() {
    const list = ref(listData); //填入下面的数据
    return { list }
  },
});
</script>

listData：

const listData = [
  {
    title: "Vue3.0 无缝滚动组件展示数据第1条",
    date: Date.now(),
  },
  {
    title: "Vue3.0 无缝滚动组件展示数据第2条",
    date: Date.now(),
  },
  {
    title: "Vue3.0 无缝滚动组件展示数据第3条",
    date: Date.now(),
  },
  {
    title: "Vue3.0 无缝滚动组件展示数据第4条",
    date: Date.now(),
  },
  {
    title: "Vue3.0 无缝滚动组件展示数据第5条",
    date: Date.now(),
  },
  {
    title: "Vue3.0 无缝滚动组件展示数据第6条",
    date: Date.now(),
  },
  {
    title: "Vue3.0 无缝滚动组件展示数据第7条",
    date: Date.now(),
  },
  {
    title: "Vue3.0 无缝滚动组件展示数据第8条",
    date: Date.now(),
  },
  {
    title: "Vue3.0 无缝滚动组件展示数据第9条",
    date: Date.now(),
  },
];