From 376bd49fa786f38f8798dfd2ec666b24e3341f72 Mon Sep 17 00:00:00 2001
From: daisy <904492381@qq.com>
Date: Wed, 26 Jun 2024 11:39:50 +0800
Subject: [PATCH] fix: resolve passive warning (#281)

---
 src/List.tsx                    |  6 +++---
 src/ScrollBar.tsx               | 12 ++++++------
 src/hooks/useMobileTouchMove.ts |  6 +++---
 3 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/List.tsx b/src/List.tsx
index 6a5c751..ad8ff80 100644
--- a/src/List.tsx
+++ b/src/List.tsx
@@ -432,9 +432,9 @@ export function RawList<T>(props: ListProps<T>, ref: React.Ref<ListRef>) {
     }
 
     const componentEle = componentRef.current;
-    componentEle.addEventListener('wheel', onRawWheel);
-    componentEle.addEventListener('DOMMouseScroll', onFireFoxScroll as any);
-    componentEle.addEventListener('MozMousePixelScroll', onMozMousePixelScroll);
+    componentEle.addEventListener('wheel', onRawWheel, { passive: false });
+    componentEle.addEventListener('DOMMouseScroll', onFireFoxScroll as any, { passive: true });
+    componentEle.addEventListener('MozMousePixelScroll', onMozMousePixelScroll, { passive: false });
 
     return () => {
       componentEle.removeEventListener('wheel', onRawWheel);
diff --git a/src/ScrollBar.tsx b/src/ScrollBar.tsx
index d8f90a7..862d00d 100644
--- a/src/ScrollBar.tsx
+++ b/src/ScrollBar.tsx
@@ -115,8 +115,8 @@ const ScrollBar = React.forwardRef<ScrollBarRef, ScrollBarProps>((props, ref) =>
 
     const scrollbarEle = scrollbarRef.current;
     const thumbEle = thumbRef.current;
-    scrollbarEle.addEventListener('touchstart', onScrollbarTouchStart);
-    thumbEle.addEventListener('touchstart', onThumbMouseDown);
+    scrollbarEle.addEventListener('touchstart', onScrollbarTouchStart, { passive: false });
+    thumbEle.addEventListener('touchstart', onThumbMouseDown, { passive: false });
 
     return () => {
       scrollbarEle.removeEventListener('touchstart', onScrollbarTouchStart);
@@ -176,10 +176,10 @@ const ScrollBar = React.forwardRef<ScrollBarRef, ScrollBarProps>((props, ref) =>
         onStopMove();
       };
 
-      window.addEventListener('mousemove', onMouseMove);
-      window.addEventListener('touchmove', onMouseMove);
-      window.addEventListener('mouseup', onMouseUp);
-      window.addEventListener('touchend', onMouseUp);
+      window.addEventListener('mousemove', onMouseMove, { passive: true });
+      window.addEventListener('touchmove', onMouseMove, { passive: true });
+      window.addEventListener('mouseup', onMouseUp, { passive: true });
+      window.addEventListener('touchend', onMouseUp, { passive: true });
 
       return () => {
         window.removeEventListener('mousemove', onMouseMove);
diff --git a/src/hooks/useMobileTouchMove.ts b/src/hooks/useMobileTouchMove.ts
index d563eb2..17740e9 100644
--- a/src/hooks/useMobileTouchMove.ts
+++ b/src/hooks/useMobileTouchMove.ts
@@ -68,8 +68,8 @@ export default function useMobileTouchMove(
       touchYRef.current = Math.ceil(e.touches[0].pageY);
 
       elementRef.current = e.target as HTMLElement;
-      elementRef.current.addEventListener('touchmove', onTouchMove);
-      elementRef.current.addEventListener('touchend', onTouchEnd);
+      elementRef.current.addEventListener('touchmove', onTouchMove, { passive: false });
+      elementRef.current.addEventListener('touchend', onTouchEnd, { passive: true });
     }
   };
 
@@ -82,7 +82,7 @@ export default function useMobileTouchMove(
 
   useLayoutEffect(() => {
     if (inVirtual) {
-      listRef.current.addEventListener('touchstart', onTouchStart);
+      listRef.current.addEventListener('touchstart', onTouchStart, { passive: true });
     }
 
     return () => {