Fix show navbar when switch tab bug

src/components/Home.tsx

@@ -11,9 +11,11 @@ const Home: React.FC = () => {
         navbarHiddenState: { navbarHidden, setNavbarHidden }
     } = useContext(MainFrameworkContext)
     const fitFullScreenRef = useRef<HTMLDivElement>(null)
+    const pathname = useLocation().pathname
 
     const [slogan, setSlogan] = useState('')
     const [sloganType, setSloganType] = useState(true)
+
     const typeText = '/* 因为热爱 所以折腾 */'
     if (sloganType) {
         setTimeout(() => {
@@ -33,13 +35,8 @@ const Home: React.FC = () => {
         }, 50)
     }
 
-    const handleScrollDown = () => {
-        hideScrollbarRef.current?.scrollY(fitFullScreenRef.current?.offsetHeight ?? 0)
-    }
-
-    useEffect(() => {
     const hideScrollbarDOM = hideScrollbarRef.current
-        const scrollListener = () => {
+    const scrollListener = useCallback(() => {
         if (
             hideScrollbarDOM &&
             fitFullScreenRef.current &&
@@ -53,16 +50,27 @@ const Home: React.FC = () => {
                 setNavbarHidden(false)
             }
         }
-        }
+    }, [hideScrollbarDOM, navbarHidden, setNavbarHidden])
+
+    useEffect(() => {
+        hideScrollbarDOM?.removeEventListener('scroll', scrollListener)
         hideScrollbarDOM?.addEventListener('scroll', scrollListener)
         return () => {
             hideScrollbarDOM?.removeEventListener('scroll', scrollListener)
         }
-    }, [hideScrollbarRef, navbarHidden, setNavbarHidden])
+    }, [hideScrollbarDOM, scrollListener])
+
+    useEffect(() => {
+        scrollListener()
+    }, [pathname, scrollListener])
+
+    const handleScrollDown = () => {
+        hideScrollbarRef.current?.scrollY(fitFullScreenRef.current?.offsetHeight ?? 0)
+    }
 
     return (
         <>
-            <FitFullScreen zIndex={100} backgroundColor={'#FBFBFB'} ref={fitFullScreenRef}>
+            <FitFullScreen backgroundColor={'#FBFBFB'} ref={fitFullScreenRef}>
                 <FitCenter>
                     <div className={'center-box'}>
                         <div className={'big-logo'}>FatWeb</div>