From 392da16c30f19e634604fdb7ef262372bdff7c79 Mon Sep 17 00:00:00 2001
From: dh <61490799+yue1123@users.noreply.github.com>
Date: Sun, 13 Aug 2023 08:24:50 +0800
Subject: [PATCH] fix(floatingPanel): lag caused by scrollbar and panel
 movement #12146 (#12161)

* fix(floatingPanel): Lag caused by scrollbar and panel movement

* fix(floatingPanel): simplify scroll position determination
---
 .../vant/src/floating-panel/FloatingPanel.tsx     | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/packages/vant/src/floating-panel/FloatingPanel.tsx b/packages/vant/src/floating-panel/FloatingPanel.tsx
index 38d190b53..51e843d4d 100644
--- a/packages/vant/src/floating-panel/FloatingPanel.tsx
+++ b/packages/vant/src/floating-panel/FloatingPanel.tsx
@@ -89,13 +89,15 @@ export default defineComponent({
       return moveY;
     };
 
-    let startY: number;
+    let startY: number,
+      maxScroll: number = -1;
     const touch = useTouch();
 
     const onTouchstart = (e: TouchEvent) => {
       touch.start(e);
       dragging.value = true;
       startY = -height.value;
+      maxScroll = -1;
     };
 
     const onTouchmove = (e: TouchEvent) => {
@@ -103,14 +105,18 @@ export default defineComponent({
 
       const target = e.target as Element;
       if (contentRef.value === target || contentRef.value?.contains(target)) {
+        const { scrollTop } = contentRef.value;
+        // If maxScroll value more than zero, indicates that panel movement is not triggered from the top
+        maxScroll = Math.max(maxScroll, scrollTop);
+
         if (!props.contentDraggable) return;
 
         if (-startY < boundary.value.max) {
           if (e.cancelable) e.preventDefault();
           e.stopPropagation();
-        } else if (
-          !(contentRef.value.scrollTop <= 0 && touch.deltaY.value > 0)
-        ) {
+        } else if (!(scrollTop <= 0 && touch.deltaY.value > 0)) {
+          return;
+        } else if (maxScroll > 0) {
           return;
         }
       }
@@ -120,6 +126,7 @@ export default defineComponent({
     };
 
     const onTouchend = () => {
+      maxScroll = -1;
       dragging.value = false;
       height.value = closest(anchors.value, height.value);