element 表格滚动 hover移入 暂停

首先用到cell-mouse-enter和cell-mouse-leave这两个属性,
不清楚的可以看下方链接

elementui

@cell-mouse-enter="moseoverTabel"
@cell-mouse-leave="moseoutTabel"
代码展示:
// 鼠标移入事件,暂停计时器
  moseoverTabel() {
    // 清除定时器
    window.clearInterval(this.timer);
  },
  // 鼠标移出事件,开启自动滚动
  moseoutTabel() {
    this.scrollAutomatic();
  },
  scrollAutomatic() {
  //这里判断表格数据过少,就不滚动
      if (this.tableData33.length <= 4) {
        return;
      }
      // 计算滚动高度--获取内容区dom
      var tabelBodyDom = window.document.querySelector(
        ".table_father_1 .el-table__body"
      );
      //获取滚动条最大滚动高度---156px指内容区的高度
      var scrollHiehgt = this.tableData33.length * 39 - 156;
      
      // 实现滚动
      if (scrollHiehgt > 0) {
        // 获取实时margin-top
        var i = 0 - window.getComputedStyle(tabelBodyDom).marginTop.replace("px", "");
        // 定时器滚动
        this.timer = window.setInterval(() => {
        //当滚动到最上方时从头开始,否则使 marginTop++
          if (i === scrollHiehgt) {
            i = 0;
          }
          tabelBodyDom.style.marginTop = 0 - i + "px";
          i++;
        }, 40);
      }
    },