iview的table根据屏幕大小变化，自动渲染表单组件

问题描述：
在项目中写了table组件，table有滚动条，table的高度在页面加载的时候计算出来，导致，屏幕大小变化时，表单不会重新渲染，导致使用体验出现了问题。
源代码：

 <Table
          class="public_table"
          :row-class-name="rowClassName"
          :columns="payrollDetailColumns"
          :data="payrollDetailData"
          :height="tableHeight"
          :style="{ height: 'calc(91vh - 50px - 16px - 55px - 134px - 32px - 70px)'}"
          size="small"
        >
        </Table>

  mounted() {
    this.loadingStatus = true;
    // console.log(this.payComData);
    this.$nextTick(() => {
      this.calTableHeight();
    });
    this.getPayrollData();//获取表单数据
  },

//动态计算表格高度
methods:{
  calTableHeight() {
      this.tableHeight =
        document.querySelector(".app").offsetHeight -
        document.querySelector(".flex_bet").offsetHeight -
        document.querySelector(".wrapper-form").offsetHeight -
        document.querySelector(".card").offsetHeight -
        document.querySelector(".searchBox").offsetHeight -
        100;
    },
}

上面的写法在页面初次加载的时候，会自动计算表格的高度，但是当变化屏幕大小的时候，表格会出现很奇怪的样子，原本的横向滚动条会消失。

代码使用，使用window.addEventListener() 添加 resize 事件监听窗口变化，同时添加一个key值来强制刷新组件
参考链接

//random是一个随机数，当random变化时，强制刷新组件，random初始值可以在data里面赋值为1.
 <Table
          class="public_table"
            :key="random" 
          :row-class-name="rowClassName"
          :columns="payrollDetailColumns"
          :data="payrollDetailData"
          :height="tableHeight"
          :style="{ height: 'calc(91vh - 50px - 16px - 55px - 134px - 32px - 70px)'}"
          size="small"
        >
        </Table>

  mounted() {
    this.loadingStatus = true;
    // console.log(this.payComData);
    this.$nextTick(() => {
      this.calTableHeight();
    });
    this.getPayrollData();//获取表单数据
        window.addEventListener("resize", this.reload); //此方法监听屏幕大小变化
  },

//动态计算表格高度
methods:{
  calTableHeight() {
      this.tableHeight =
        document.querySelector(".app").offsetHeight -
        document.querySelector(".flex_bet").offsetHeight -
        document.querySelector(".wrapper-form").offsetHeight -
        document.querySelector(".card").offsetHeight -
        document.querySelector(".searchBox").offsetHeight -
        100;
    },
     reload() {
      // 重新渲染,改变random的值
      this.random = new Date().getTime() * 1000 + (this.random++ % 1000);
      this.calTableHeight(); //强制刷新之后，重新计算表格的高度
    },
}