fix(comp:carousel): pre and next arrow should hide when item count is…

… 0 (#1871)
IDuxFE · Apr 8, 2024 · e8a6d6e · e8a6d6e
1 parent 49eb4ea
commit e8a6d6e
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 6 deletions.
diff --git a/packages/components/carousel/__tests__/carousel.spec.ts b/packages/components/carousel/__tests__/carousel.spec.ts
@@ -107,11 +107,8 @@ describe('Carousel', () => {
       },
     })
 
-    await wrapper.find('.ix-carousel-arrow-prev').trigger('click')
-    expect(onChange).toHaveBeenCalledTimes(0)
-
-    await wrapper.find('.ix-carousel-arrow-next').trigger('click')
-    expect(onChange).toHaveBeenCalledTimes(0)
+    expect(wrapper.find('.ix-carousel-arrow-prev').exists()).toBeFalsy()
+    expect(wrapper.find('.ix-carousel-arrow-next').exists()).toBeFalsy()
   })
 
   test('slot dot work', async () => {

diff --git a/packages/components/carousel/src/Carousel.tsx b/packages/components/carousel/src/Carousel.tsx
@@ -191,7 +191,7 @@ export default defineComponent({
               ))}
             </div>
           </div>
-          {mergedShowArrow.value && (
+          {mergedShowArrow.value && children.length > 1 && (
             <>
               <div key="__arrow-prev" class={`${prefixCls}-arrow ${prefixCls}-arrow-prev`} onClick={prev}>
                 {slots.arrow ? slots.arrow({ type: 'prev' }) : <IxIcon name="left-filled" />}

diff --git a/packages/components/carousel/src/composables/useStrategy.ts b/packages/components/carousel/src/composables/useStrategy.ts
@@ -88,6 +88,11 @@ export function useStrategy(
     }
 
     const { from, to } = getBoundary(activeIndex.value, index, length)
+
+    if (from === to) {
+      return
+    }
+
     nextIndex.value = index
     runningIndex.value = to