el-table 表格自动循环滚动,鼠标滑入 停止滚动 鼠标离开 继续滚动

只为记录 方便后续查找

let timer =ref(null)
let scrollStatus = ref<boolean>(true)

创建事件

// 创建滚动事件
const createScroll = () => {
  clearScroll()
  // 拿到 table
  const table = myTable.value.layout.table.refs
  // 拿到可以滚动的元素
  const tableWrapper = table.bodyWrapper.firstElementChild.firstElementChild
  timer.value = setInterval(() => {
    if (scrollStatus.value) {
      tableWrapper.scrollTop += 1

      // 判断是否滚动到底部，如果到底部了置为0（可视高度+距离顶部=整个高度）
      if (tableWrapper.clientHeight + tableWrapper.scrollTop >= tableWrapper.scrollHeight) {
        tableWrapper.scrollTop = 0
      }
    }
  }, 80)
}

鼠标进入

const handleMouseEnter = () => {
  scrollStatus.value = false
}

鼠标离开

const handleMouseLeave = () => {
  scrollStatus.value = true
}