From f70feab438380ce5cdfa8343d7aa48b4cbc698dd Mon Sep 17 00:00:00 2001
From: inottn <inottn@outlook.com>
Date: Mon, 11 Mar 2024 20:55:13 +0800
Subject: [PATCH] fix(ImagePreview): allow user to swipe to next image when the
 current image is moved to the edge (#12666)

---
 packages/vant/src/image-preview/ImagePreview.tsx     | 1 +
 packages/vant/src/image-preview/ImagePreviewItem.tsx | 8 +++++---
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/packages/vant/src/image-preview/ImagePreview.tsx b/packages/vant/src/image-preview/ImagePreview.tsx
index e2e2a2398..91df7a157 100644
--- a/packages/vant/src/image-preview/ImagePreview.tsx
+++ b/packages/vant/src/image-preview/ImagePreview.tsx
@@ -190,6 +190,7 @@ export default defineComponent({
             doubleScale={props.doubleScale}
             closeOnClickImage={props.closeOnClickImage}
             closeOnClickOverlay={props.closeOnClickOverlay}
+            vertical={props.vertical}
             onScale={emitScale}
             onClose={emitClose}
             onLongPress={() => emit('longPress', { index })}
diff --git a/packages/vant/src/image-preview/ImagePreviewItem.tsx b/packages/vant/src/image-preview/ImagePreviewItem.tsx
index 3476d7c81..8a34f28ec 100644
--- a/packages/vant/src/image-preview/ImagePreviewItem.tsx
+++ b/packages/vant/src/image-preview/ImagePreviewItem.tsx
@@ -56,6 +56,7 @@ const imagePreviewItemProps = {
   doubleScale: Boolean,
   closeOnClickImage: Boolean,
   closeOnClickOverlay: Boolean,
+  vertical: Boolean,
 };
 
 export type ImagePreviewItemProps = ExtractPropTypes<
@@ -225,9 +226,10 @@ export default defineComponent({
         // if the image is moved to the edge, no longer trigger move,
         // allow user to swipe to next image
         if (
-          (moveX > maxMoveX.value || moveX < -maxMoveX.value) &&
-          !isImageMoved &&
-          touch.isHorizontal()
+          (props.vertical
+            ? touch.isVertical() && Math.abs(moveY) > maxMoveY.value
+            : touch.isHorizontal() && Math.abs(moveX) > maxMoveX.value) &&
+          !isImageMoved
         ) {
           state.moving = false;
           return;