css 文件 sticky-table-header.scss

.el-table[is-sticky] {
  overflow: initial;
  --sticky-top: 0px;
  --stick-zIndex: 5;

  .el-table__header-wrapper{
    position: sticky;
    top: var(--sticky-top);
    z-index: var(--stick-zIndex);
  }

  .el-table__fixed, .el-table__fixed-right{
    overflow: visible;
    z-index: var(--stick-zIndex);
    
    .el-table__fixed-header-wrapper {
      position: sticky;
      top: var(--sticky-top);
      width: 100%;
      overflow: hidden;
      z-index: var(--stick-zIndex);
    }
    .el-table__fixed-body-wrapper {
      width: 100%;
      overflow: hidden;
    }
  }

  .el-table__fixed-right {
    .el-table__fixed-header-wrapper {
      display: flex;
      justify-content: flex-end;
    }
    .el-table__fixed-body-wrapper {
      display: flex;
      justify-content: flex-end;
    }
  }

  &.el-table--border::after{
    z-index: var(--stick-zIndex);
  }
}

.el-table__fixed {
  --box-shadow: 10px 0 10px -10px rgba(0, 0, 0, 0.12);
}

.el-table__fixed-right {
  --box-shadow: -10px 0 10px -10px rgba(0, 0, 0, 0.12);
}

.el-table__fixed, .el-table__fixed-right {
  box-shadow: var(--box-shadow);
}

js 指令形式

import '@/styles/sticky-table-header.scss'

export default {
  bind(el, binding) {
    el.setAttribute('is-sticky', true)
    updateStickyTop(el, binding)
  },
  update(el, binding) {
    updateStickyTop(el, binding)
  }
}

const updateStickyTop = (el, binding) => {
  const { value, oldValue } = binding
  if (value === oldValue) return

  const top = Number(value)
  if (!isNaN(top)) {
    el.style.setProperty('--sticky-top', `${top}px`)
  }
}