ant-design-vue中table组件自动滚动

1、实现效果

2、所需代码

<template>
<div class="card-data-wrap" style="height: 280px;overflow: hidden;">
     <a-table  class="hidden-tbody"
               :columns="columns"
               :data-source="dataSource"
                :pagination="false" // 隐藏分页
                >
      </a-table>
      <vue-seamless-scroll 
      			:data="dataSource"  
      			class="auto-scorll-table" 
      			:class-option="optionSingleHeight">
                 <a-table 
                         :data-source="dataSource"  
                          class="custom-table-2 hidden-thead" 
                          :columns="columns" 
                          :pagination="false">
    			</a-table>
      </vue-seamless-scroll>
</div>
</tempalte>
<script>
  export default {
    data() {
      return {
        columns: [
          {
            title: '序号',
            dataIndex: '',
            key:'rowIndex',
            width:60,
            align:"center",
            customRender:function (t,r,index) {
              return parseInt(index)+1;
            },
          },
          {
            title: '姓名',
            dataIndex: 'aan001',
            key: 'aan001',
            align:"center",
          },
          {
            title: '身份证',
            dataIndex: 'aac001',
            key: 'aac001',
            align:"center",
          },
          {
            title: '时间',
            dataIndex: 'crb002',
            key: 'crb002',
            align:"center",
          },
          {
            title: '预警个数',
            dataIndex: 'crb005',
            key: 'crb005',
            align:"center",
          },
        ],
        dataSource: [
          {
            key: '1',
            aan001: 'John Brown',
            age: 32,
            address: 'New York No. 1 Lake Park',
          },
          {
            key: '2',
            aan001: 'Jim Green',
            age: 42,
            address: 'London No. 1 Lake Park',
          },
          {
            key: '3',
            aan001: 'Joe Black',
            age: 32,
            address: 'Sidney No. 1 Lake Park',
          },
          {
            key: '4',
            aan001: 'John Brown',
            age: 32,
            address: 'New York No. 1 Lake Park',
          },
          {
            key: '5',
            aan001: 'John Brown',
            age: 32,
            address: 'New York No. 1 Lake Park',
          },
          {
            key: '6',
            aan001: 'John Brown',
            age: 32,
            address: 'New York No. 1 Lake Park',
          },
          {
            key: '7',
            aan001: 'John Brown',
            age: 32,
            address: 'New York No. 1 Lake Park',
          },
        ],
      }
    },
    computed: {
      optionSingleHeight() {
        return {
          singleHeight: 54 // 这里要变成你的一行表格的高度 可以审查元素
        }
      }
    },
  }
</script>
<style lang="less" scoped>
.hidden-tbody /deep/.ant-table {
  height: 54px;
  box-sizing: border-box;
  tbody { //隐藏上面表格的tbody
    display: none !important;
    overflow: hidden;
  }
}
.auto-scorll-table {
  height: calc(100% - 54px);
  overflow: hidden;
}
.hidden-thead /deep/.ant-table {
  border-top: none; //防止边框重叠
  thead { //隐藏下面表格的thead
    display: none;
    overflow: hidden;
  }
}
</style>