From c114a0ef47293738cf1dd804786afc71b4ee108e Mon Sep 17 00:00:00 2001
From: chenjiahan <chenjiahan@youzan.com>
Date: Sun, 27 Dec 2020 21:13:07 +0800
Subject: [PATCH] fix(Popup): lockScroll not work #7738

---
 package.json                                  |  2 +-
 packages/vant-use/changelog.md                |  6 ++
 .../vant-use/src/useScrollParent/index.ts     |  7 +-
 src/composables/use-lock-scroll.ts            | 68 ++++++++++++++++---
 src/popup/index.js                            |  5 +-
 yarn.lock                                     |  8 +--
 6 files changed, 78 insertions(+), 18 deletions(-)

diff --git a/package.json b/package.json
index dfce6438f..883407b60 100644
--- a/package.json
+++ b/package.json
@@ -60,7 +60,7 @@
     "@vant/icons": "^1.5.0",
     "@vant/lazyload": "^1.0.2",
     "@vant/popperjs": "^1.0.2",
-    "@vant/use": "^1.0.0"
+    "@vant/use": "^1.0.1"
   },
   "peerDependencies": {
     "vue": "^3.0.0"
diff --git a/packages/vant-use/changelog.md b/packages/vant-use/changelog.md
index f16338899..437d2db00 100644
--- a/packages/vant-use/changelog.md
+++ b/packages/vant-use/changelog.md
@@ -1,5 +1,11 @@
 # 更新日志
 
+### v1.0.1
+
+`2020-12-27`
+
+- 导出个别内部方法供 Vant 使用
+
 ### v1.0.0
 
 `2020-12-15`
diff --git a/packages/vant-use/src/useScrollParent/index.ts b/packages/vant-use/src/useScrollParent/index.ts
index 5968f2df5..d4a5a65cb 100644
--- a/packages/vant-use/src/useScrollParent/index.ts
+++ b/packages/vant-use/src/useScrollParent/index.ts
@@ -28,12 +28,15 @@ export function getScrollParent(el: Element, root: ScrollElement = window) {
   return root;
 }
 
-export function useScrollParent(el: Ref<Element | undefined>) {
+export function useScrollParent(
+  el: Ref<Element | undefined>,
+  root: ScrollElement = window
+) {
   const scrollParent = ref<Element | Window>();
 
   onMounted(() => {
     if (el.value) {
-      scrollParent.value = getScrollParent(el.value);
+      scrollParent.value = getScrollParent(el.value, root);
     }
   });
 
diff --git a/src/composables/use-lock-scroll.ts b/src/composables/use-lock-scroll.ts
index c64e9edf6..16ae9de70 100644
--- a/src/composables/use-lock-scroll.ts
+++ b/src/composables/use-lock-scroll.ts
@@ -1,22 +1,70 @@
-let count = 0;
+import { Ref } from 'vue';
+import { getScrollParent, supportsPassive } from '@vant/use';
+import { useTouch } from './use-touch';
+import { preventDefault } from '../utils';
 
-const CLASSNAME = 'van-overflow-hidden';
+let totalLockCount = 0;
+
+const BODY_LOCK_CLASS = 'van-overflow-hidden';
+
+export function useLockScroll(
+  rootRef: Ref<HTMLElement | undefined>,
+  shouldLock: () => boolean
+) {
+  const touch = useTouch();
+
+  const onTouchMove = (event: TouchEvent) => {
+    touch.move(event);
+
+    const direction = touch.deltaY.value > 0 ? '10' : '01';
+    const el = getScrollParent(
+      event.target as Element,
+      rootRef.value
+    ) as HTMLElement;
+    const { scrollHeight, offsetHeight, scrollTop } = el;
+    let status = '11';
+
+    if (scrollTop === 0) {
+      status = offsetHeight >= scrollHeight ? '00' : '01';
+    } else if (scrollTop + offsetHeight >= scrollHeight) {
+      status = '10';
+    }
+
+    if (
+      status !== '11' &&
+      touch.isVertical() &&
+      !(parseInt(status, 2) & parseInt(direction, 2))
+    ) {
+      preventDefault(event, true);
+    }
+  };
 
-export function useLockScroll(shouldLock: () => boolean) {
   const lock = () => {
     if (shouldLock()) {
-      if (!count) {
-        document.body.classList.add(CLASSNAME);
+      document.addEventListener('touchstart', touch.start);
+      document.addEventListener(
+        'touchmove',
+        onTouchMove,
+        supportsPassive ? { passive: false } : false
+      );
+
+      if (!totalLockCount) {
+        document.body.classList.add(BODY_LOCK_CLASS);
       }
-      count++;
+
+      totalLockCount++;
     }
   };
 
   const unlock = () => {
-    if (shouldLock() && count) {
-      count--;
-      if (!count) {
-        document.body.classList.remove(CLASSNAME);
+    if (shouldLock() && totalLockCount) {
+      document.removeEventListener('touchstart', touch.start);
+      document.removeEventListener('touchmove', onTouchMove);
+
+      totalLockCount--;
+
+      if (!totalLockCount) {
+        document.body.classList.remove(BODY_LOCK_CLASS);
       }
     }
   };
diff --git a/src/popup/index.js b/src/popup/index.js
index 4a8e143b8..025028bee 100644
--- a/src/popup/index.js
+++ b/src/popup/index.js
@@ -112,7 +112,10 @@ export default createComponent({
     const zIndex = ref();
     const popupRef = ref();
 
-    const [lockScroll, unlockScroll] = useLockScroll(() => props.lockScroll);
+    const [lockScroll, unlockScroll] = useLockScroll(
+      popupRef,
+      () => props.lockScroll
+    );
 
     const lazyRender = useLazyRender(() => props.show || !props.lazyRender);
 
diff --git a/yarn.lock b/yarn.lock
index 5904eda8e..a7ff2d736 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1996,10 +1996,10 @@
   resolved "https://registry.yarnpkg.com/@vant/touch-emulator/-/touch-emulator-1.2.0.tgz#486300b23e57db9ce9231a04e0a0c621c68692d8"
   integrity sha512-sJ97zU85zOq51qoi7+CpBEcOyH3CitjP1KC7/GQwqaurUJni+EP7/F9n0HMnAh8GXMjgtgDBNJ5z48x+coNKYQ==
 
-"@vant/use@^1.0.0":
-  version "1.0.0"
-  resolved "https://registry.npm.taobao.org/@vant/use/download/@vant/use-1.0.0.tgz?cache=0&sync_timestamp=1608030568231&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40vant%2Fuse%2Fdownload%2F%40vant%2Fuse-1.0.0.tgz#68db22af1130ccf867814fec5ec8c4f7ad94f36d"
-  integrity sha1-aNsirxEwzPhngU/sXsjE962U820=
+"@vant/use@^1.0.1":
+  version "1.0.1"
+  resolved "https://registry.npm.taobao.org/@vant/use/download/@vant/use-1.0.1.tgz#8b9a037e3340052b5ca829f260bd25c35977a608"
+  integrity sha1-i5oDfjNABStcqCnyYL0lw1l3pgg=
   dependencies:
     "@babel/runtime" "7.x"