侧边菜单隐藏处理

components/JumpToTop.js

@@ -16,7 +16,7 @@ const JumpToTop = ({ targetRef, showPercent = true }) => {
   const [percent, changePercent] = useState(0)
   const scrollListener = useCallback(throttle(() => {
     // 处理是否显示回到顶部按钮
-    const clientHeight = targetRef ? (targetRef.current.clientHeight) : 0
+    const clientHeight = targetRef ? (targetRef.current ? targetRef.current.clientHeight : 0) : 0
     const scrollY = window.pageYOffset
     const fullHeight = clientHeight - window.outerHeight
     const shouldShow = scrollY > 100

components/MenuButtonGroup.js

@@ -29,7 +29,7 @@ const MenuButtonGroup = ({ allowCollapse = false }) => {
                 <div className='my-auto w-5 text-2xl justify-center flex'>
                   <i className={'fa ' + link.icon} />
                 </div>
-                <div className={(allowCollapse ? 'hidden xl:block' : '') + ' ml-4 w-32'}>{link.name}</div>
+                <div className={'ml-4 w-32'}>{link.name}</div>
             </a>
           )
       )}

components/SideBar.js

@@ -8,11 +8,9 @@ const SideBar = ({ tags, currentTag, post }) => {
     <div
       className='dark:bg-gray-800 border-r dark:border-gray-700 h-full scroll-hidden left-0 duration-500 ease-in-out min-h-screen'>
       <div id='sidebar' className='hidden md:block sticky top-20 duration-500'>
-        <div className='hidden xl:block'>
+        <div className={post ? 'block' : 'hidden xl:block'}>
           <InfoCard />
           <hr className='dark:border-gray-700' />
-        </div>
-        <div className={post ? 'hidden xl:block' : 'block'}>
           <MenuButtonGroup allowCollapse={true} />
         </div>