chore(Menu): check hozInLine in adjustChildrenWidth

STLighter · Jul 10, 2019 · 17de169 · 17de169
1 parent 63f9962
commit 17de169
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 5 deletions.
diff --git a/docs/menu/demo/hoz.md b/docs/menu/demo/hoz.md
@@ -20,7 +20,7 @@ import { Menu } from '@alifd/next';
 const { SubMenu, Item } = Menu;
 
 ReactDOM.render(
-    <Menu hozInLine direction="hoz" mode="popup" className="my-hoz-menu" popupClassName="my-hoz-menu" popupAutoWidth>
+    <Menu hozInLine direction="hoz" mode="inline" className="my-hoz-menu" popupClassName="my-hoz-menu" popupAutoWidth>
         <Item key="1">First</Item>
         <Item key="2">Second</Item>
         <SubMenu label="Sub Nav">
@@ -48,4 +48,7 @@ ReactDOM.render(
 .my-hoz-menu .next-menu-item {
     width: 160px;
 }
+.my-hoz-menu .next-menu-item.next-menu-more {
+    width: 40px;
+}
 ````
diff --git a/src/menu/main.scss b/src/menu/main.scss
@@ -156,13 +156,13 @@
             white-space: nowrap;
 
             #{$menu-prefix}-more {
-                width: 40px;
                 padding: 0;
                 text-align: center;
             }
         }
 
         > #{$menu-prefix}-item,
+        > #{$menu-prefix}-sub-menu-wrapper,
         #{$menu-prefix}-content > #{$menu-prefix}-item {
             display: inline-block;
             vertical-align: top;

diff --git a/src/menu/view/menu.jsx b/src/menu/view/menu.jsx
@@ -142,7 +142,7 @@ export default class Menu extends Component {
          */
         hozAlign: PropTypes.oneOf(['left', 'right']),
         /**
-         * 横向菜单模式下，是否维持在一行，即超出一行折叠成 SubMenu 显示， 仅在 direction 为 'hoz' 时生效
+         * 横向菜单模式下，是否维持在一行，即超出一行折叠成 SubMenu 显示， 仅在 direction='hoz' mode='popup' 时生效
          */
         hozInLine: PropTypes.bool,
         /**
@@ -304,8 +304,8 @@ export default class Menu extends Component {
     }
 
     adjustChildrenWidth() {
-        const { direction, prefix } = this.props;
-        if (direction !== 'hoz') {
+        const { direction, prefix, hozInLine } = this.props;
+        if (direction !== 'hoz' || !hozInLine) {
             return;
         }