vue将两个el-table上下拼接合成一个展示且横向滚动条联动

将两个结构一样的el-table并列放在一起，下面的table隐藏表头

:show-header="false"

//给两个table 绑定ref属性

  scroll () {
      let table1 = this.$refs.table1.bodyWrapper // 上表格
      let table2 = this.$refs.table2.bodyWrapper // 下表格
      table2.addEventListener('scroll', () => {
        // 滚动监听事件
        table1.scrollLeft = table2.scrollLeft
        this.$nextTick(() => {
       // 表格滚动时有一定概率发生错位
          this.$refs.table1.doLayout()
          this.$refs.table2.doLayout()
        })
      })
     },

//然后隐藏上面子表格的滚动条

<style scoped lang="scss">
  #topTable{
    ::-webkit-scrollbar, ::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb{
      display: none;
    }
  }

</style>