fix(VSlideGroup): correct hasNext after resize (#21124)

w-daniels · web-flow · commit 0633aef52540 · 2025-08-29T19:57:51.000+02:00
fixes #21115
diff --git a/packages/vuetify/src/components/VSlideGroup/VSlideGroup.tsx b/packages/vuetify/src/components/VSlideGroup/VSlideGroup.tsx
@@ -344,6 +344,8 @@ export const VSlideGroup = genericComponent<new <T>(
       isSelected: group.isSelected,
     }))
 
+    const hasOverflowOrScroll = computed(() => isOverflowing.value || Math.abs(scrollOffset.value) > 0)
+
     const hasAffixes = computed(() => {
       switch (props.showArrows) {
         // Always show arrows on desktop & mobile
@@ -354,20 +356,20 @@ export const VSlideGroup = genericComponent<new <T>(
 
         // Show arrows on mobile when overflowing.
         // This matches the default 2.2 behavior
-        case true: return isOverflowing.value || Math.abs(scrollOffset.value) > 0
+        case true: return hasOverflowOrScroll.value
 
         // Always show on mobile
         case 'mobile': return (
           mobile.value ||
-          (isOverflowing.value || Math.abs(scrollOffset.value) > 0)
+          hasOverflowOrScroll.value
         )
 
         // https://material.io/components/tabs#scrollable-tabs
         // Always show arrows when
         // overflowed on desktop
         default: return (
           !mobile.value &&
-          (isOverflowing.value || Math.abs(scrollOffset.value) > 0)
+          hasOverflowOrScroll.value
         )
       }
     })
@@ -378,7 +380,7 @@ export const VSlideGroup = genericComponent<new <T>(
     })
 
     const hasNext = computed(() => {
-      if (!containerRef.value) return false
+      if (!containerRef.value || !hasOverflowOrScroll.value) return false
 
       const scrollSize = getScrollSize(isHorizontal.value, containerRef.el)
       const clientSize = getClientSize(isHorizontal.value, containerRef.el)
