diff --git a/pages/posts/[domain].vue b/pages/posts/[domain].vue index ec982b6a..06ba5eb9 100644 --- a/pages/posts/[domain].vue +++ b/pages/posts/[domain].vue @@ -601,6 +601,7 @@ const virtualRows = computed(() => rowVirtualizer.value.getVirtualItems()) const totalSize = computed(() => rowVirtualizer.value.getTotalSize()) + const virtualItemEls: Ref<(HTMLElement | null)[]> = shallowRef([]) // Next page loader watchEffect(() => { @@ -636,8 +637,10 @@ }) // FIX: Remove when this issue is fixed - https://github.com/TanStack/virtual/issues/619#issuecomment-1969516091 - const measureElement = (el) => { - nextTick(() => { + const measureAll = () => { + rowVirtualizer.value.measureElement(null) + + virtualItemEls.value.forEach((el) => { if (!el) { return } @@ -646,6 +649,14 @@ }) } + onMounted(() => { + measureAll() + }) + + onUpdated(() => { + measureAll() + }) + /** * SEO */ @@ -1009,7 +1020,7 @@
  • diff --git a/pages/premium/saved-posts/[domain].vue b/pages/premium/saved-posts/[domain].vue index f3fc62d4..fb0a66b3 100644 --- a/pages/premium/saved-posts/[domain].vue +++ b/pages/premium/saved-posts/[domain].vue @@ -503,6 +503,7 @@ const virtualRows = computed(() => rowVirtualizer.value.getVirtualItems()) const totalSize = computed(() => rowVirtualizer.value.getTotalSize()) + const virtualItemEls: Ref<(HTMLElement | null)[]> = shallowRef([]) // Next page loader watchEffect(() => { @@ -538,8 +539,10 @@ }) // FIX: Remove when this issue is fixed - https://github.com/TanStack/virtual/issues/619#issuecomment-1969516091 - const measureElement = (el) => { - nextTick(() => { + const measureAll = () => { + rowVirtualizer.value.measureElement(null) + + virtualItemEls.value.forEach((el) => { if (!el) { return } @@ -548,6 +551,14 @@ }) } + onMounted(() => { + measureAll() + }) + + onUpdated(() => { + measureAll() + }) + /** * SEO */ @@ -805,7 +816,7 @@