From 3bd89eb7d91abf32c5b55dcf11f85dd26be262a2 Mon Sep 17 00:00:00 2001
From: moonrailgun <moonrailgun@gmail.com>
Date: Sat, 28 Aug 2021 19:33:44 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E4=BB=8E=E7=A7=BB?=
 =?UTF-8?q?=E5=8A=A8=E7=AB=AF=E5=AE=BD=E5=BA=A6=E8=BD=AC=E5=8F=98=E4=B8=BA?=
 =?UTF-8?q?pc=E7=AB=AF=E6=97=B6=E5=A6=82=E6=9E=9C=E4=BE=A7=E8=BE=B9?=
 =?UTF-8?q?=E6=A0=8F=E4=B8=8D=E5=87=BA=E7=8E=B0=E5=88=99=E4=BC=9A=E5=AF=BC?=
 =?UTF-8?q?=E8=87=B4=E6=97=A0=E6=B3=95=E6=98=BE=E7=A4=BA=E7=9A=84bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/routes/Main/Content/PageContent.tsx | 37 +++++----------------
 1 file changed, 8 insertions(+), 29 deletions(-)

diff --git a/web/src/routes/Main/Content/PageContent.tsx b/web/src/routes/Main/Content/PageContent.tsx
index c2c51efa..02b352f9 100644
--- a/web/src/routes/Main/Content/PageContent.tsx
+++ b/web/src/routes/Main/Content/PageContent.tsx
@@ -1,36 +1,10 @@
-import React, { useCallback } from 'react';
+import React, { useCallback, useEffect } from 'react';
 import { useSidebarContext } from '../SidebarContext';
 import _isNil from 'lodash/isNil';
 import { useDrag } from 'react-use-gesture';
 import { useIsMobile } from '@/hooks/useIsMobile';
 import clsx from 'clsx';
 
-// const ContentDetail = styled.div`
-//   flex: 1;
-//   background-color: ${(props) => props.theme.style.contentBackgroundColor};
-//   display: flex;
-//   flex-direction: column;
-//   position: relative;
-//   overflow: hidden;
-
-//   @media (max-width: 768px) {
-//     width: ${(props) => `calc(100vw - ${props.theme.style.navbarWidth})`};
-//     min-width: ${(props) => `calc(100vw - ${props.theme.style.navbarWidth})`};
-//   }
-// `;
-
-// const SidebarContainer = styled.div<{
-//   showSidebar: boolean;
-// }>`
-//   ${(props) => props.theme.mixins.transition('width', 0.2)};
-//   width: ${(props) => (props.showSidebar ? props.theme.style.sidebarWidth : 0)};
-//   background-color: ${(props) => props.theme.style.sidebarBackgroundColor};
-//   overflow: hidden;
-//   display: flex;
-//   flex-direction: column;
-//   flex: none;
-// `;
-
 const PageContentRoot: React.FC = (props) => (
   <div className="flex flex-row flex-1 overflow-hidden">{props.children}</div>
 );
@@ -64,8 +38,6 @@ PageGestureWrapper.displayName = 'PageGestureWrapper';
 
 /**
  * 用于渲染实际页面的组件，即除了导航栏剩余的内容
- *
- * TODO: 移动端适配
  */
 export const PageContent: React.FC<PageContentProps> = React.memo((props) => {
   const { sidebar, children } = props;
@@ -75,6 +47,13 @@ export const PageContent: React.FC<PageContentProps> = React.memo((props) => {
     setShowSidebar(false);
   }, []);
 
+  useEffect(() => {
+    if (isMobile === false) {
+      // 如果不为移动端, 则一定显示侧边栏
+      setShowSidebar(true);
+    }
+  }, [isMobile]);
+
   const sidebarEl = _isNil(sidebar) ? null : (
     <div
       className={clsx('bg-gray-800 flex-shrink-0 transition-width', {