From 6230d7288c9810cac24b820a55a306da22e8a487 Mon Sep 17 00:00:00 2001
From: FatttSnake <fatttsnake@gmail.com>
Date: Thu, 7 Sep 2023 00:18:59 +0800
Subject: [PATCH] Add button in Home.tsx to test navbar hidden

---
 src/components/Home.tsx     | 12 ++++++++++++
 src/pages/MainFramework.tsx | 20 +++++++++++++-------
 2 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/src/components/Home.tsx b/src/components/Home.tsx
index 6b49d5c..e73e06a 100644
--- a/src/components/Home.tsx
+++ b/src/components/Home.tsx
@@ -1,10 +1,22 @@
 import React from 'react'
 import '@/assets/css/home.scss'
+import { MainFrameworkContext } from '@/pages/MainFramework'
 
 const Home: React.FC = () => {
+    const {
+        navbarHiddenState: { navbarHidden, setNavbarHidden }
+    } = useContext(MainFrameworkContext)
+    const handleButtonClick = () => {
+        setNavbarHidden(!navbarHidden)
+    }
     return (
         <>
             <h1>Home</h1>
+            <div style={{ marginTop: '100px' }}>
+                <AntdButton onClick={handleButtonClick}>
+                    {navbarHidden ? '显示' : '隐藏'}
+                </AntdButton>
+            </div>
         </>
     )
 }
diff --git a/src/pages/MainFramework.tsx b/src/pages/MainFramework.tsx
index 6497756..df695b0 100644
--- a/src/pages/MainFramework.tsx
+++ b/src/pages/MainFramework.tsx
@@ -3,20 +3,24 @@ import '@/assets/css/header.scss'
 import LoadingMask from '@/components/LoadingMask.tsx'
 
 export const MainFrameworkContext = createContext<{
-    hideNavbar: boolean
-    setHideNavbar: (newValue: boolean) => void
+    navbarHiddenState: {
+        navbarHidden: boolean
+        setNavbarHidden: (newValue: boolean) => void
+    }
 }>({
-    hideNavbar: false,
-    setHideNavbar: () => undefined
+    navbarHiddenState: {
+        navbarHidden: false,
+        setNavbarHidden: () => undefined
+    }
 })
 
 const MainFramework: React.FC = () => {
-    const [hideNavbar, setHideNavbar] = useState(false)
+    const [navbarHidden, setNavbarHidden] = useState(false)
 
     return (
         <>
             <div className={'body'}>
-                <header className={'nav ' + (hideNavbar ? 'hide' : '')}>
+                <header className={'nav ' + (navbarHidden ? 'hide' : '')}>
                     <a className={'logo'} href={'https://fatweb.top'}>
                         <span className={'title'}>FatWeb</span>
                     </a>
@@ -56,7 +60,9 @@ const MainFramework: React.FC = () => {
                     </nav>
                 </header>
 
-                <MainFrameworkContext.Provider value={{ hideNavbar, setHideNavbar }}>
+                <MainFrameworkContext.Provider
+                    value={{ navbarHiddenState: { navbarHidden, setNavbarHidden } }}
+                >
                     <Suspense
                         fallback={
                             <>