vue3+elementPlus实现无缝滚动表格封装

vue3+elementPlus+css+js 模拟liMarquee插件，实现无限滚动效果

功能：1、表格数据大于一定数量之后，开始向上滚动

           2、当鼠标移入的时候，动画停止，鼠标移出，继续动画

           3、滚动动画的速度可以自定义

           4、表格的高度固定

           5、向上滚动时，无限滚动，不存在卡顿

<template>

  <div

    class="scrolling-table-container"

    @mouseenter="pauseAnimation"

    @mouseleave="resumeAnimation"

  >

    <div class="table-wrapper" :style="{ height: tableHeight }">

      <el-table

        :data="displayData"

        :loading="loading"

        style="width: 100%"

        :show-header="showHeader"

        :row-key="rowKey"

        class="scrolling-table"

        :class="{

          'enable-scroll': needScroll,

          'is-paused': isPaused

        }"

      >

        <el-table-column

          v-for="column in columns"

          :key="column.prop"

          :prop="column.prop"

          :label="column.label"

          :width="column.width"

          :min-width="column.minWidth"

          :fixed="column.fixed"

        >

          <template #default="scope" v-if="column.hasSlot">

            &