From 544b769b32907f9c0ec0855d5cb581ca62391d34 Mon Sep 17 00:00:00 2001
From: "tangly1024.com" <tlyong1992@hotmail.com>
Date: Wed, 29 May 2024 14:39:28 +0800
Subject: [PATCH] =?UTF-8?q?heo=E5=AF=BC=E8=88=AA=E6=A0=8F=E4=B8=80?=
 =?UTF-8?q?=E7=82=B9=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 themes/heo/components/Header.js | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/themes/heo/components/Header.js b/themes/heo/components/Header.js
index c23cb81f..0f048ede 100644
--- a/themes/heo/components/Header.js
+++ b/themes/heo/components/Header.js
@@ -1,6 +1,7 @@
 import { siteConfig } from '@/lib/config'
 import { isBrowser } from '@/lib/utils'
 import throttle from 'lodash.throttle'
+import { useRouter } from 'next/router'
 import { useCallback, useEffect, useRef, useState } from 'react'
 import DarkModeButton from './DarkModeButton'
 import Logo from './Logo'
@@ -21,6 +22,7 @@ const Header = props => {
   const [navBgWhite, setBgWhite] = useState(false)
   const [activeIndex, setActiveIndex] = useState(0)
 
+  const router = useRouter()
   const slideOverRef = useRef()
 
   const toggleMenuOpen = () => {
@@ -34,15 +36,15 @@ const Header = props => {
     throttle(() => {
       const scrollS = window.scrollY
       // 导航栏设置 白色背景
-      if (scrollS <= 0) {
+      if (scrollS <= 1) {
         setFixedNav(false)
         setBgWhite(false)
+        setTextWhite(false)
 
         // 文章详情页特殊处理
-        if (document.querySelector('#post-bg')) {
+        if (document?.querySelector('#post-bg')) {
           setFixedNav(true)
           setTextWhite(true)
-          setBgWhite(false)
         }
       } else {
         // 向下滚动后的导航样式
@@ -50,19 +52,21 @@ const Header = props => {
         setTextWhite(false)
         setBgWhite(true)
       }
-    }, 200)
+    }, 100)
   )
+  useEffect(() => {
+    scrollTrigger()
+  }, [router])
 
   // 监听滚动
   useEffect(() => {
-    scrollTrigger()
     window.addEventListener('scroll', scrollTrigger)
     return () => {
       window.removeEventListener('scroll', scrollTrigger)
     }
   }, [])
 
-  // 监听导航栏显示文字
+  // 导航栏根据滚动轮播菜单内容
   useEffect(() => {
     let prevScrollY = 0
     let ticking = false
@@ -71,17 +75,14 @@ const Header = props => {
       if (!ticking) {
         window.requestAnimationFrame(() => {
           const currentScrollY = window.scrollY
-
           if (currentScrollY > prevScrollY) {
             setActiveIndex(1) // 向下滚动时设置activeIndex为1
           } else {
             setActiveIndex(0) // 向上滚动时设置activeIndex为0
           }
-
           prevScrollY = currentScrollY
           ticking = false
         })
-
         ticking = true
       }
     }