From 589582f0eb2879a7852e0919f543e5b509e4baaa Mon Sep 17 00:00:00 2001 From: jcollier Date: Wed, 3 Apr 2024 10:56:06 -0400 Subject: [PATCH] fix #5518: prevent erros thrown by ScrollPanel loading in some cases --- components/lib/scrollpanel/ScrollPanel.vue | 32 ++++++++++++---------- 1 file changed, 18 insertions(+), 14 deletions(-) diff --git a/components/lib/scrollpanel/ScrollPanel.vue b/components/lib/scrollpanel/ScrollPanel.vue index 99f315991..c4515d01d 100644 --- a/components/lib/scrollpanel/ScrollPanel.vue +++ b/components/lib/scrollpanel/ScrollPanel.vue @@ -129,22 +129,26 @@ export default { this.scrollYRatio = ownHeight / totalHeight; this.frame = this.requestAnimationFrame(() => { - if (this.scrollXRatio >= 1) { - this.$refs.xBar.setAttribute('data-p-scrollpanel-hidden', 'true'); - !this.isUnstyled && DomHandler.addClass(this.$refs.xBar, 'p-scrollpanel-hidden'); - } else { - this.$refs.xBar.setAttribute('data-p-scrollpanel-hidden', 'false'); - !this.isUnstyled && DomHandler.removeClass(this.$refs.xBar, 'p-scrollpanel-hidden'); - this.$refs.xBar.style.cssText = 'width:' + Math.max(this.scrollXRatio * 100, 10) + '%; left:' + (this.$refs.content.scrollLeft / totalWidth) * 100 + '%;bottom:' + bottom + 'px;'; + if (this.$refs.xBar) { + if (this.scrollXRatio >= 1) { + this.$refs.xBar.setAttribute('data-p-scrollpanel-hidden', 'true'); + !this.isUnstyled && DomHandler.addClass(this.$refs.xBar, 'p-scrollpanel-hidden'); + } else { + this.$refs.xBar.setAttribute('data-p-scrollpanel-hidden', 'false'); + !this.isUnstyled && DomHandler.removeClass(this.$refs.xBar, 'p-scrollpanel-hidden'); + this.$refs.xBar.style.cssText = 'width:' + Math.max(this.scrollXRatio * 100, 10) + '%; left:' + (this.$refs.content.scrollLeft / totalWidth) * 100 + '%;bottom:' + bottom + 'px;'; + } } - if (this.scrollYRatio >= 1) { - this.$refs.yBar.setAttribute('data-p-scrollpanel-hidden', 'true'); - !this.isUnstyled && DomHandler.addClass(this.$refs.yBar, 'p-scrollpanel-hidden'); - } else { - this.$refs.yBar.setAttribute('data-p-scrollpanel-hidden', 'false'); - !this.isUnstyled && DomHandler.removeClass(this.$refs.yBar, 'p-scrollpanel-hidden'); - this.$refs.yBar.style.cssText = 'height:' + Math.max(this.scrollYRatio * 100, 10) + '%; top: calc(' + (this.$refs.content.scrollTop / totalHeight) * 100 + '% - ' + this.$refs.xBar.clientHeight + 'px);right:' + right + 'px;'; + if (this.$refs.yBar) { + if (this.scrollYRatio >= 1) { + this.$refs.yBar.setAttribute('data-p-scrollpanel-hidden', 'true'); + !this.isUnstyled && DomHandler.addClass(this.$refs.yBar, 'p-scrollpanel-hidden'); + } else { + this.$refs.yBar.setAttribute('data-p-scrollpanel-hidden', 'false'); + !this.isUnstyled && DomHandler.removeClass(this.$refs.yBar, 'p-scrollpanel-hidden'); + this.$refs.yBar.style.cssText = 'height:' + Math.max(this.scrollYRatio * 100, 10) + '%; top: calc(' + (this.$refs.content.scrollTop / totalHeight) * 100 + '% - ' + this.$refs.xBar.clientHeight + 'px);right:' + right + 'px;'; + } } }); }