Revert "fix: runtimeSideWidth undefined"

This reverts commit 534fd82.
gweiguo · Feb 8, 2021 · 1cbb2b3 · 1cbb2b3
1 parent 534fd82
commit 1cbb2b3
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 27 deletions.
diff --git a/src/RouteContext.tsx b/src/RouteContext.tsx
@@ -46,7 +46,6 @@ export interface RouteContextProps extends Partial<PureSettings>, MenuState {
   hasFooterToolbar?: boolean;
   hasFooter?: boolean;
   setHasFooterToolbar?: (bool: boolean) => void;
-  collapsedWidth?: number;
   /* 附加属性 */
   [key: string]: any;
 }

diff --git a/src/SiderMenu/SiderMenu.tsx b/src/SiderMenu/SiderMenu.tsx
@@ -92,6 +92,7 @@ const SiderMenu: FunctionalComponent<SiderMenuProps> = (props: SiderMenuProps) =
     onOpenKeys,
     onSelect,
     breakpoint,
+    collapsedWidth = 48,
     menuExtraRender = false,
     menuContentRender = false,
     menuFooterRender = false,
@@ -100,11 +101,13 @@ const SiderMenu: FunctionalComponent<SiderMenuProps> = (props: SiderMenuProps) =
   const { getPrefixCls } = useProProvider();
   const context = useRouteContext();
   const baseClassName = getPrefixCls('sider');
-  const collapsedWidth = context.collapsedWidth || 48;
+
   // const isMix = computed(() => props.layout === 'mix');
   // const fixed = computed(() => context.fixSiderbar);
   const runtimeTheme = computed(() => (props.layout === 'mix' && 'light') || props.navTheme);
-  const runtimeSideWidth = computed(() => (props.collapsed ? collapsedWidth : siderWidth));
+  const runtimeSideWidth = computed(() =>
+    props.collapsed ? props.collapsedWidth : props.siderWidth,
+  );
 
   const classNames = computed(() => {
     return {
@@ -174,31 +177,29 @@ const SiderMenu: FunctionalComponent<SiderMenuProps> = (props: SiderMenuProps) =
         <div style="flex: 1; overflow: hidden auto;">
           {(menuContentRender && menuContentRender(props, defaultMenuDom)) || defaultMenuDom}
         </div>
-        {!context.isMobile && (
-          <div class={`${baseClassName}-links`}>
-            <Menu
-              class={`${baseClassName}-link-menu`}
-              inlineIndent={16}
-              theme={runtimeTheme.value as 'light' | 'dark'}
-              selectedKeys={[]}
-              openKeys={[]}
-              mode="inline"
-              onClick={() => {
-                if (onCollapse) {
-                  onCollapse(!props.collapsed);
-                }
-              }}
+        <div class={`${baseClassName}-links`}>
+          <Menu
+            class={`${baseClassName}-link-menu`}
+            inlineIndent={16}
+            theme={runtimeTheme.value as 'light' | 'dark'}
+            selectedKeys={[]}
+            openKeys={[]}
+            mode="inline"
+            onClick={() => {
+              if (onCollapse) {
+                onCollapse(!props.collapsed);
+              }
+            }}
+          >
+            <Menu.Item
+              key={'collapsed-button'}
+              class={`${baseClassName}-collapsed-button`}
+              title={null}
             >
-              <Menu.Item
-                key={'collapsed-button'}
-                class={`${baseClassName}-collapsed-button`}
-                title={null}
-              >
-                {collapsedButtonRender && collapsedButtonRender(collapsed)}
-              </Menu.Item>
-            </Menu>
-          </div>
-        )}
+              {collapsedButtonRender && collapsedButtonRender(collapsed)}
+            </Menu.Item>
+          </Menu>
+        </div>
         {menuFooterRender && <div class={`${baseClassName}-footer`}>{menuFooterRender(props)}</div>}
       </Sider>
     </>