From 12748db7b7161dd3aa56cc95ae326775fc455ec0 Mon Sep 17 00:00:00 2001 From: "Joshua J. Berry" Date: Sun, 22 Sep 2024 11:23:22 -0400 Subject: [PATCH] load-more: Stop loader if component is unmounted [#533] If the `` component is unmounted while it is loading, AND while `is-fully-loaded="false"`, the loader function will get stuck in an infinite loop. Stop the loader from running by explicitly noting the component is no longer visible when it is unmounted. --- src/components/load-more.vue | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/components/load-more.vue b/src/components/load-more.vue index 387e22a..66878f4 100644 --- a/src/components/load-more.vue +++ b/src/components/load-more.vue @@ -76,10 +76,6 @@ export default defineComponent({ /** Are we currently trying to load more data (i.e. waiting for load() * to return)? */ isLoading: false, - - /** We keep a ref to the IntersectionObserver so we can disconnect it - * when the component is unmounted. */ - observer: undefined as IntersectionObserver | undefined, }), computed: { @@ -112,6 +108,11 @@ export default defineComponent({ observer.observe(this.el!); }, beforeUnmount() { + // We must explicitly clear isVisible here because if we're in the middle of + // loadMore() when the component is unmounted, AND if `!this.isFullyLoaded` + // at unmount time, then loadMore() will continue to loop infinitely. + this.isVisible = false; + callbacks.delete(this.el!); observer.unobserve(this.el!); },