fix(scroll): 修复移动端快速滚动时控制台报错 close #2266 (#2302)

fix(scroll): 修复移动端滚动时控制台报错 close #2266 Co-authored-by: 卿珂 <[email protected]>
antvis · Aug 31, 2023 · 4ccc03d · 4ccc03d · vercel · Aug 31, 2023
1 parent 4374119
commit 4ccc03d
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/packages/s2-core/src/facet/base-facet.ts b/packages/s2-core/src/facet/base-facet.ts
@@ -201,6 +201,7 @@ export abstract class BaseFacet {
       const originEvent = ev.event;
       const { deltaX, deltaY, x, y } = ev;
       // The coordinates of mobile and pc are three times different
+      // TODO: 手指快速往上滚动时, deltaY 有时会为负数, 导致向下滚动时然后回弹, 看起来就像表格在抖动, 需要判断滚动方向, next 版本未复现
       this.onWheel({
         ...originEvent,
         deltaX,
@@ -927,9 +928,14 @@ export abstract class BaseFacet {
   };
 
   private stopScrollChaining = (event: WheelEvent) => {
-    event?.preventDefault?.();
+    if (event?.cancelable) {
+      event?.preventDefault?.();
+    }
     // 移动端的 prevent 存在于 originalEvent上
-    (event as unknown as GraphEvent)?.originalEvent?.preventDefault?.();
+    const mobileEvent = (event as unknown as GraphEvent)?.originalEvent;
+    if (mobileEvent?.cancelable) {
+      mobileEvent?.preventDefault?.();
+    }
   };
 
   onWheel = (event: WheelEvent) => {

diff --git a/packages/s2-react/playground/index.html b/packages/s2-react/playground/index.html
@@ -8,6 +8,5 @@
   <body>
     <div id="root"></div>
     <script type="module" src="./index.tsx"></script>
-
   </body>
-</html>
+</html>
-Original file line number
+Diff line change
@@ Expand Up / @@ -8,6 +8,5 @@ @@
       <body>
         <div id="root"></div>
         <script type="module" src="./index.tsx"></script>
       </body>
-    </html>
+    </html>