fix: bad position of collapsible submenu in sider when collapsed

components/layout/demo/side.md

@@ -1,6 +1,7 @@
 ---
 order: 3
 iframe: 360
+only: true
 title:
   zh-CN: 侧边布局
   en-US: Sider
@@ -10,7 +11,7 @@ title:
 
 侧边两列式布局。页面横向空间有限时，侧边导航可收起。
 
-侧边导航在页面布局上采用的是左右的结构，一般主导航放置于页面的左侧固定位置，辅助菜单放置于工作区顶部。内容根据浏览器终端进行自适应，能提高横向空间的使用率，但是整个页面排版不稳定。侧边导航的模式层级扩展性强，一、二、三级导航项目可以更为顺畅且具关联性的被展示，同时侧边导航可以固定，使得用户在操作和浏览中可以快速的定位和切换当前位置，有很高的操作效率。但这类导航横向页面内容的空间会被牺牲一部份。
+侧边导航在页面布局上采用的是左右的结构，一般主导航放置于页面的左侧固定位置，辅助菜单放置于工作区顶部。内容根据浏览器终端进行自适应，能提高横向空间的使用率，但是整个页面排版不稳定。侧边导航的模式层级扩展性强，一、二、三级导航项目可以更为顺畅且具关联性的被展示，同时侧边导航可以固定，使得用户在操作和浏览中可以快速的定位和切换当前位置，有很高的操作效率。但这类导航横向页面内容的空间会被牺牲一部分。
 
 ## en-US
 
@@ -49,7 +50,7 @@ class SiderDemo extends React.Component {
           onCollapse={this.onCollapse}
         >
           <div className="logo" />
-          <Menu theme="dark" defaultSelectedKeys={['1']} mode="inline">
+          <Menu theme="dark" defaultSelectedKeys={['1']} mode="inline" subMenuCloseDelay={9999}>
             <Menu.Item key="1">
               <Icon type="pie-chart" />
               <span>Option 1</span>

components/menu/index.tsx

@@ -89,6 +89,7 @@ class Menu extends React.Component<MenuProps, MenuState> {
   context: any;
   switchingModeFromInline: boolean;
   inlineOpenKeys: string[] = [];
+  contextSiderCollapsed: boolean = true;
 
   constructor(props: MenuProps) {
     super(props);
@@ -129,12 +130,20 @@ class Menu extends React.Component<MenuProps, MenuState> {
     if (prevProps.mode === 'inline' && this.props.mode !== 'inline') {
       this.switchingModeFromInline = true;
     }
-    if (this.props.inlineCollapsed && !prevProps.inlineCollapsed) {
+    if (
+      (this.props.inlineCollapsed && !prevProps.inlineCollapsed) ||
+      (this.getInlineCollapsed() && this.contextSiderCollapsed)
+    ) {
+      this.contextSiderCollapsed = false;
       this.switchingModeFromInline = true;
       this.inlineOpenKeys = this.state.openKeys;
       this.setState({ openKeys: [] });
     }
-    if (!this.props.inlineCollapsed && prevProps.inlineCollapsed) {
+    if (
+      (!this.props.inlineCollapsed && prevProps.inlineCollapsed) ||
+      (!this.getInlineCollapsed() && !this.contextSiderCollapsed)
+    ) {
+      this.contextSiderCollapsed = true;
       this.setState({ openKeys: this.inlineOpenKeys });
       this.inlineOpenKeys = [];
     }