vue 项目中el-table实现无线滚动效果

给table一个ref属性，

mounted的时候调用方法

scrollTable(this.$refs.respRankingListTable);

function scrollTable (table) {
  // const self = this
  // 拿到表格挂载后的真实DOM
  // const table = self.$refs[val]
  // 拿到表格中承载数据的div元素
  const divData = table.bodyWrapper
  const timer = startInterval(divData) // 定时器1
  let timer1 = null // 定时器2
  // 移出的时候清除第一个定时器开启第二个定时器
  divData.addEventListener('mouseleave', function (e) {
    if (timer) clearInterval(timer)
    timer1 = startInterval(divData)
  })
  // 移入的时候清除两个定时器
  divData.addEventListener('mouseenter', function (e) {
    if (timer) clearInterval(timer)
    if (timer1) clearInterval(timer1)
  })
}
function startInterval (divData) {
  // 拿到元素后，对元素进行定时增加距离顶部距离，实现滚动效果(此配置为每100毫秒移动1像素)
  const timer = setInterval(() => {
    // 元素自增距离顶部1像素
    divData.scrollTop += 1
    // 判断元素是否滚动到底部(可视高度+距离顶部=整个高度)
    if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) {
      // 重置table距离顶部距离
      divData.scrollTop = 0
    }
  }, 100)
  return timer
}