Window.resize или document.resize, что работает, а что нет?VueJS

Question

Я использую Vuetable и это потрясающе.

Я пытаюсь создать верхнюю горизонтальную прокрутку, что я сделал, и она работает нормально.Но мне нужно назначить некоторые события на window.resize.

Я создал компонент, такой как

<template>
<div class="top-scrollbar">
  <div class="top-horizontal-scroll"></div>
</div>
</template>

<style scoped>
.top-scrollbar {
  width: 100%;
  height: 20px;
  overflow-x: scroll;
  overflow-y: hidden;
  margin-left: 14px;

  .top-horizontal-scroll {
    height: 20px;
  }
}
</style>

<script>
export default {
  mounted() {
    document.querySelector("div.top-scrollbar").addEventListener('scroll', this.handleScroll);
    document.querySelector("div.vuetable-body-wrapper").addEventListener('scroll', this.tableScroll);
  },
  methods: {
    handleScroll () {
      document.querySelector("div.vuetable-body-wrapper").scrollLeft = document.querySelector("div.top-scrollbar").scrollLeft
    },

    tableScroll() {
      document.querySelector("div.top-scrollbar").scrollLeft = document.querySelector("div.vuetable-body-wrapper").scrollLeft
    }
  }
}
</script>

Я вызываю его над таблицей, например <v-horizontal-scroll />

Я создал миксин как

Vue.mixin({
  methods: {
    setScrollBar: () => {
      let tableWidth = document.querySelector("table.vuetable").offsetWidth;
      let tableWrapper = document.querySelector("div.vuetable-body-wrapper").offsetWidth;

      document.querySelector("div.top-horizontal-scroll").style.width = tableWidth + "px";
      document.querySelector("div.top-scrollbar").style.width = tableWrapper + "px"
    }
  }
})

И я вызываю его, когда пользовательский компонент, на котором создается Vuetable

  beforeUpdate() {
    document.addEventListener("resize", this.setScrollBar());
  },

  mounted() {
    this.$nextTick(function() {
      window.addEventListener('resize', this.setScrollBar);
      this.setScrollBar()
    });
  },

Я хочу понять, как происходит это изменение размераработает.

Если я изменю хотя бы одну вещь в приведенном выше коде.У меня начинаются проблемы.

Либо он неправильно устанавливает ширину основного div прокрутки, либо даже this.setScrollBar не работает при изменении размера.

Мне не ясно, что этологика и как это работает?