fix: suspense repeat trigger

react-component · Dec 19, 2024 · 4506204 · 4506204
1 parent e4bd175
commit 4506204
Showing 1 changed file with 11 additions and 0 deletions.
diff --git a/src/hooks/useStatus.ts b/src/hooks/useStatus.ts
@@ -191,8 +191,17 @@ export default function useStatus(
   activeRef.current = active;
 
   // ============================ Status ============================
+  const visibleRef = useRef<boolean | null>(null);
+
   // Update with new status
   useIsomorphicLayoutEffect(() => {
+    // When use Suspense, the `visible` will repeat trigger,
+    // But not real change of the `visible`, we need to skip it.
+    // https://github.com/ant-design/ant-design/issues/44379
+    if (mountedRef.current && visibleRef.current === visible) {
+      return;
+    }
+
     setAsyncVisible(visible);
 
     const isMounted = mountedRef.current;
@@ -232,6 +241,8 @@ export default function useStatus(
       // Set back in case no motion but prev status has prepare step
       setStatus(STATUS_NONE);
     }
+
+    visibleRef.current = visible;
   }, [visible]);
 
   // ============================ Effect ============================