el-table滚动加载

 <div class="bottom">
              <div class="title">优惠历史</div>
              <div style="overflow: auto; height: 220px">
                <el-table
                  v-el-table-infinite-scroll="load"
                  border
                  :data="historyData"
                  class="customer-no-border-table"
                  v-loading="historyLoading"
                  element-loading-text="数据正在加载中..."
                  :row-class-name="tableRowClassName"
                  :header-cell-style="{
                    background: '#E7F2FD',
                    color: '#252525',
                  }"
                  style="
                    width: 100%;
                    border-top: 1px solid #409eff;
                    margin-top: 0px;
                  "
                  height="220"
                >
                  <el-table-column
                    type="index"
                    label="序号"
                    width="50"
                    align="center"
                    header-align="center"
                  ></el-table-column>
                  <el-table-column
                    v-for="(item, index) in historyColumns"
                    :show-overflow-tooltip="item.prop == 'activityName'"
                    :width="item.width"
                    :key="index"
                    :prop="item.prop"
                    :label="item.label"
                    :formatter="item.formatter"
                    align="center"
                  >
                  </el-table-column>
                  <el-table-column
                    label="操作"
                    width="150"
                    align="center"
                    header-align="center"
                  >
                    <template #default="{ row }">
                      <span
                        v-for="(item, index) in listBtns2"
                        :key="index"
                        class="underline"
                        @click="getDetail(item.resourceRemark, row)"
                      >
                        {{ item.resourceName }}
                      </span>
                    </template>
                  </el-table-column>
                  <div slot="empty">
                    <img
                      src="@/assets/nodata.png"
                      style="width: 150px; height: 105px"
                    />
                    <div
                      style="
                        font-size: 16px;
                        color: #666666;
                        height: 20px;
                        line-height: 20px;
                      "
                    >
                      暂无数据
                    </div>
                  </div>
                </el-table>
              </div>
            </div>
          </div>

  // 请求优惠历史数据
    getHistory() {
      this.historyLoading = true;
      postToken(selectCompanyActivityHistory, {
        companyCode: this.trData.companyCode,
        buildId: this.buildRow.id,
        page: this.historyPage.page,
      }).then((res) => {
        if (res.data.status == 1) {
          let result = res.data;
          this.historyData = this.historyData.concat(result.rows);
          this.historyPage.total = result.total;
          console.log(this.historyData, result.rows, "优惠历史");
        } else {
          this.$message.error(res.data.msg);
        }
        this.historyLoading = false;
      });
    },

　　

  load() {
      console.log("表格scroll", this.historyPage.page, this.historyPage.total);
      if (this.historyPage.total > 0) {
        this.historyPage.page++;
        let totalPage = Math.ceil(
          this.historyPage.total / this.historyPage.size
        );
        console.log(this.historyPage.page, totalPage, "表格滚动");
        if (this.historyPage.page > totalPage) {
          return;
        } else {
          this.getHistory();
        }
      }
    },