Revert "fix: get isMobile props from RouteContext"

This reverts commit 4d986e4.
gweiguo · Feb 8, 2021 · 7ea945d · 7ea945d
1 parent 1cbb2b3
commit 7ea945d
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 13 deletions.
diff --git a/src/BasicLayout.tsx b/src/BasicLayout.tsx
@@ -9,7 +9,6 @@ import { default as Header, HeaderViewProps } from './Header';
 import { RenderVNodeType, WithFalse } from './typings';
 import { getComponentOrSlot, PropRenderType, PropTypes } from './utils';
 import './BasicLayout.less';
-import { useRouteContext } from './RouteContext';
 
 const defaultI18nRender = (key: string) => key;
 
@@ -61,10 +60,9 @@ const ProLayout: FunctionalComponent<BasicLayoutProps> = (props, { emit, slots }
     matchMenuKeys,
     navTheme,
     menuData,
+    isMobile,
     // defaultCollapsed,
   } = props;
-  const routeContext = useRouteContext();
-  const { isMobile } = routeContext;
   const isTop = computed(() => layout === 'top');
   // const isSide = computed(() => layout === 'side');
   // const isMix = computed(() => layout === 'mix');

diff --git a/src/GlobalHeader/index.tsx b/src/GlobalHeader/index.tsx
@@ -13,7 +13,6 @@ import { clearMenuItem } from '../utils';
 import type { HeaderViewProps } from '../Header';
 import './index.less';
 import { useProProvider } from '../ProProvider';
-import { useRouteContext } from '../RouteContext';
 
 export interface GlobalHeaderProps extends Partial<PureSettings> {
   collapsed?: boolean;
@@ -52,6 +51,7 @@ export const GlobalHeader: FunctionalComponent<GlobalHeaderProps & PrivateSiderM
   { slots },
 ) => {
   const {
+    isMobile,
     logo,
     collapsed,
     onCollapse,
@@ -66,8 +66,6 @@ export const GlobalHeader: FunctionalComponent<GlobalHeaderProps & PrivateSiderM
     menuData,
     prefixCls: customPrefixCls,
   } = props;
-  const routeContext = useRouteContext();
-  const { isMobile } = routeContext;
   const { getPrefixCls } = useProProvider();
   const prefixCls = customPrefixCls || getPrefixCls();
   const baseClassName = computed(() => `${prefixCls}-global-header`);

diff --git a/src/Header.tsx b/src/Header.tsx
@@ -68,6 +68,7 @@ export const HeaderView = defineComponent({
       prefixCls,
       headerRender,
       headerContentRender,
+      isMobile,
       fixedHeader,
       hasSiderMenu,
       headerHeight,
@@ -76,11 +77,10 @@ export const HeaderView = defineComponent({
       onCollapse,
     } = toRefs(props);
     const context = useRouteContext();
-    const { isMobile } = context;
     const needFixedHeader = computed(() => fixedHeader.value || layout.value === 'mix');
     const isTop = computed(() => layout.value === 'top');
     const needSettingWidth = computed(
-      () => needFixedHeader.value && hasSiderMenu.value && !isTop.value && !isMobile,
+      () => needFixedHeader.value && hasSiderMenu.value && !isTop.value && !isMobile.value,
     );
     // cache menu
     const clearMenuData = computed(
@@ -99,7 +99,7 @@ export const HeaderView = defineComponent({
           {headerContentRender && headerContentRender.value && headerContentRender.value(props)}
         </GlobalHeader>
       );
-      if (isTop.value && !isMobile) {
+      if (isTop.value && !isMobile.value) {
         defaultDom = (
           <TopNavHeader
             theme={navTheme.value as 'light' | 'dark'}

diff --git a/src/SiderMenu/index.tsx b/src/SiderMenu/index.tsx
@@ -4,14 +4,11 @@ import 'ant-design-vue/es/drawer/style';
 import Drawer from 'ant-design-vue/es/drawer';
 
 import SiderMenu, { SiderMenuProps, PrivateSiderMenuProps } from './SiderMenu';
-import { useRouteContext } from '../RouteContext';
 
 export type SiderMenuWrapperProps = SiderMenuProps & Partial<PrivateSiderMenuProps>;
 
 const SiderMenuWrapper: FunctionalComponent<SiderMenuWrapperProps> = props => {
-  const routeContext = useRouteContext();
-  const { isMobile } = routeContext;
-  return isMobile ? (
+  return props.isMobile ? (
     <Drawer>
       <SiderMenu {...props} />
     </Drawer>