fix(Swiper): resolved click event invalid (#1064)

Tencent · Aug 31, 2023 · 159976c · 159976c
1 parent 8498e5b
commit 159976c
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/src/swiper/demos/base.vue b/src/swiper/demos/base.vue
@@ -1,6 +1,6 @@
 <template>
   <div style="padding: 0 16px">
-    <t-swiper :navigation="{ type: 'dots' }" :autoplay="false" @change="handleChange">
+    <t-swiper :navigation="{ type: 'dots' }" :autoplay="false" @click="handleClick" @change="handleChange">
       <t-swiper-item v-for="(item, index) in swiperList" :key="index" style="height: 192px">
         <img :src="item" class="img" />
       </t-swiper-item>
@@ -20,6 +20,10 @@ const swiperList = [
 const handleChange = (index: number, context: any) => {
   console.log('基础示例,页数变化到》》》', index, context);
 };
+
+const handleClick = (value: number) => {
+  console.log('click: ', value);
+};
 </script>
 
 <style>

diff --git a/src/swiper/swiper.vue b/src/swiper/swiper.vue
@@ -10,7 +10,6 @@
         height: containerHeight,
       }"
       @transitionend="handleAnimationEnd"
-      @click="onItemClick"
     >
       <slot />
     </div>
@@ -173,6 +172,7 @@ const { lengthX, lengthY } = useSwipe(swiperContainer, {
   passive: false,
   onSwipeStart() {
     if (disabled.value) return;
+    onItemClick(); // use touchstart to simulate click on swipe start
     stopAutoplay();
   },
   onSwipe(e: TouchEvent) {