fix: runtimeSideWidth undefined

src/RouteContext.tsx

@@ -46,6 +46,7 @@ export interface RouteContextProps extends Partial<PureSettings>, MenuState {
   hasFooterToolbar?: boolean;
   hasFooter?: boolean;
   setHasFooterToolbar?: (bool: boolean) => void;
+  collapsedWidth?: number;
   /* 附加属性 */
   [key: string]: any;
 }

src/SiderMenu/SiderMenu.tsx

@@ -92,7 +92,6 @@ const SiderMenu: FunctionalComponent<SiderMenuProps> = (props: SiderMenuProps) =
     onOpenKeys,
     onSelect,
     breakpoint,
-    collapsedWidth = 48,
     menuExtraRender = false,
     menuContentRender = false,
     menuFooterRender = false,
@@ -101,13 +100,11 @@ 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 ? props.collapsedWidth : props.siderWidth,
-  );
+  const runtimeSideWidth = computed(() => (props.collapsed ? collapsedWidth : siderWidth));
 
   const classNames = computed(() => {
     return {
@@ -177,6 +174,7 @@ 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`}
@@ -200,6 +198,7 @@ const SiderMenu: FunctionalComponent<SiderMenuProps> = (props: SiderMenuProps) =
               </Menu.Item>
             </Menu>
           </div>
+        )}
         {menuFooterRender && <div class={`${baseClassName}-footer`}>{menuFooterRender(props)}</div>}
       </Sider>
     </>