diff options
Diffstat (limited to 'apps/files/src')
| -rw-r--r-- | apps/files/src/mixins/filesListWidth.ts | 13 |
1 files changed, 9 insertions, 4 deletions
diff --git a/apps/files/src/mixins/filesListWidth.ts b/apps/files/src/mixins/filesListWidth.ts index 4acccb01fd9..7d7ec598673 100644 --- a/apps/files/src/mixins/filesListWidth.ts +++ b/apps/files/src/mixins/filesListWidth.ts @@ -3,26 +3,31 @@ * SPDX-License-Identifier: AGPL-3.0-or-later */ -import Vue from 'vue' +import { defineComponent } from 'vue' -export default Vue.extend({ +export default defineComponent({ data() { return { - filesListWidth: null as number | null, + filesListWidth: 0, } }, + mounted() { const fileListEl = document.querySelector('#app-content-vue') - this.filesListWidth = fileListEl?.clientWidth ?? null + this.filesListWidth = fileListEl?.clientWidth ?? 0 + // @ts-expect-error The resize observer is just now attached to the object this.$resizeObserver = new ResizeObserver((entries) => { if (entries.length > 0 && entries[0].target === fileListEl) { this.filesListWidth = entries[0].contentRect.width } }) + // @ts-expect-error The resize observer was attached right before to the this object this.$resizeObserver.observe(fileListEl as Element) }, + beforeDestroy() { + // @ts-expect-error mounted must have been called before the destroy, so the resize this.$resizeObserver.disconnect() }, }) |