fix: safari page blank

src/hooks/use-overlay-scroller.ts

@@ -3,7 +3,7 @@ import {
   UseOverlayScrollbarsParams,
   useOverlayScrollbars
 } from 'overlayscrollbars-react';
-import React from 'react';
+import React, { useEffect } from 'react';
 
 export const overlaySollerOptions: UseOverlayScrollbarsParams = {
   options: {
@@ -52,7 +52,7 @@ export default function useOverlayScroller(options?: any) {
   const throttledScroll = React.useCallback(
     throttle(() => {
       scrollEventElement.current?.scrollTo?.({
-        top: scrollEventElement.current.scrollHeight,
+        top: scrollEventElement.current?.scrollHeight,
         behavior: 'smooth'
       });
       instanceRef.current?.update?.();
@@ -82,10 +82,6 @@ export default function useOverlayScroller(options?: any) {
 
   // scroll to top
   const updateScrollerPositionToTop = React.useCallback(() => {
-    console.log(
-      ' scrollEventElement.current.scrollHeight====',
-      scrollEventElement.current.scrollHeight
-    );
     scrollEventElement.current?.scrollTo?.({
       top: 0,
       behavior: 'auto'
@@ -107,13 +103,6 @@ export default function useOverlayScroller(options?: any) {
       if (el) {
         initialize(el);
         initialized.current = true;
-        console.log(
-          'createInstance===2',
-          initialized.current,
-          instanceRef.current,
-          instance?.(),
-          instance
-        );
         instanceRef.current = instance?.();
         scrollEventElement.current =
           instanceRef.current?.elements()?.scrollEventElement;
@@ -122,6 +111,12 @@ export default function useOverlayScroller(options?: any) {
     [initialize, instance]
   );
 
+  useEffect(() => {
+    return () => {
+      instanceRef.current?.destroy?.();
+    };
+  }, [instance]);
+
   return {
     initialize: createInstance,
     instance: instanceRef.current,

src/layouts/error-boundary.tsx

@@ -15,13 +15,11 @@ class ErrorBoundary extends Component<
     };
   }
 
-  // 捕获错误并更新状态
   static getDerivedStateFromError(error: any) {
     console.error('Error caught by Error Boundary:', error);
     return { hasError: true };
   }
 
-  // 记录错误信息（可选）
   componentDidCatch(error: any, info: any) {
     console.error('Error caught by Error Boundary:', error);
     console.error(info);

src/layouts/index.tsx

@@ -195,13 +195,25 @@ export default (props: any) => {
   }, [initialize]);
 
   useEffect(() => {
-    const menuWrap = document.querySelector(
+    const checkAndInitialize = () => {
-      '.ant-menu.ant-menu-root'
+      const menuWrap = window.document.querySelector(
-    )?.parentElement;
+        '.ant-menu.ant-menu-root'
-    if (menuWrap) {
+      )?.parentElement;
-      initializeMenu(menuWrap);
+      if (menuWrap) {
-    }
+        try {
-  }, [initializeMenu]);
+          initializeMenu(menuWrap);
+        } catch (error) {
+          console.error('Failed to initialize menu:', error);
+        }
+      } else {
+        console.warn('Menu wrapper not found.');
+      }
+    };
+
+    const timeout = setTimeout(checkAndInitialize, 500);
+
+    return () => clearTimeout(timeout);
+  }, [initializeMenu, matchedRoute, location]);
 
   const renderMenuHeader = useCallback(
     (logo, title) => {