Merge pull request #90 from hiui-group/hotfix/#88

Hotfix/#88
hiui-group · Jan 11, 2022 · e26b293 · e26b293
2 parents f1e8cdd + 698adf9
commit e26b293
Show file tree

Hide file tree

Showing 7 changed files with 42 additions and 18 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,9 +1,13 @@
 # 更新日志
 
+## 3.7.0
+
+- 添加 disabledAutoFallback props，支持禁用自动 fallback 到第一个有效路由 [#88](https://github.com/XiaoMi/hiui/issues/88)
+- 优化 支持 React.lazy 模式和 keepAlive 模式兼容 [#87](https://github.com/XiaoMi/hiui/issues/87)
 
 ## 3.6.0
 
-- 添加 unmountOnTagClose props，支持 keepAlive 模式下点击 tag 关闭触发组件实例销毁  [#85](https://github.com/XiaoMi/hiui/issues/85)
+- 添加 unmountOnTagClose props，支持 keepAlive 模式下点击 tag 关闭触发组件实例销毁 [#85](https://github.com/XiaoMi/hiui/issues/85)
 
 ## 3.5.4
 

diff --git a/examples/theme/index.jsx b/examples/theme/index.jsx
@@ -109,6 +109,9 @@ class App extends Component {
           onMenuClick={(item) => {
             console.log('item', item)
           }}
+          fallback={'/iot'}
+          // basename={'basename'}
+          // disabledAutoFallback
         />
       </React.Suspense>
     )

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hi-ui/classic-theme",
-  "version": "3.6.0",
+  "version": "3.7.0",
   "description": "Classic theme for HIUI",
   "main": "./es/index.js",
   "scripts": {

diff --git a/src/components/Layout/ClassicLayout.jsx b/src/components/Layout/ClassicLayout.jsx
@@ -20,6 +20,7 @@ const ClassicLayout = ({
   login,
   toolbar,
   fallback,
+  disabledAutoFallback,
   siderTopRender,
   siderBottomRender,
   footer,
@@ -44,7 +45,8 @@ const ClassicLayout = ({
     location,
     history,
     fallback,
-    onMenuClick
+    onMenuClick,
+    disabledAutoFallback
   )
   const isWithoutLayout = currentMenu && currentMenu.withoutLayout
   const activeMainMenu = selectedMenus[0]
@@ -137,11 +139,13 @@ const ClassicLayout = ({
                   />
                 ) : null
               })}
-              <Redirect
-                to={{
-                  pathname: location.pathname === '/' ? defaultPath : fallback || defaultPath
-                }}
-              />
+              {typeof fallback === 'string' || typeof defaultPath === 'string' ? (
+                <Redirect
+                  to={{
+                    pathname: location.pathname === '/' ? defaultPath : fallback || defaultPath
+                  }}
+                />
+              ) : null}
             </Switch>
           </div>
           {footer && <Footer footer={footer} />}

diff --git a/src/components/Layout/GenuineLayout.jsx b/src/components/Layout/GenuineLayout.jsx
@@ -20,6 +20,7 @@ const GenuineLayout = ({
   login,
   toolbar,
   fallback,
+  disabledAutoFallback,
   siderTopRender,
   siderBottomRender,
   footer,
@@ -43,7 +44,8 @@ const GenuineLayout = ({
     location,
     history,
     fallback,
-    onMenuClick
+    onMenuClick,
+    disabledAutoFallback
   )
   const isWithoutLayout = currentMenu && currentMenu.withoutLayout
 
@@ -135,11 +137,13 @@ const GenuineLayout = ({
                     />
                   ) : null
                 })}
-                <Redirect
-                  to={{
-                    pathname: location.pathname === '/' ? defaultPath : fallback || defaultPath
-                  }}
-                />
+                {typeof fallback === 'string' || typeof defaultPath === 'string' ? (
+                  <Redirect
+                    to={{
+                      pathname: location.pathname === '/' ? defaultPath : fallback || defaultPath
+                    }}
+                  />
+                ) : null}
               </Switch>
             </div>
             {footer && <Footer footer={footer} />}

diff --git a/src/hooks/useMenuCalculator.js b/src/hooks/useMenuCalculator.js
@@ -4,14 +4,16 @@ import { findMenu, getAncestor, getDefaultActiveMenu } from '../util/common'
 
 const reg = /(http|https):\/\/([\w.]+\/?)\S*/gi
 
-const useMenuCalculator = (menu, location, history, fallback, onMenuClick) => {
+const useMenuCalculator = (menu, location, history, fallback, onMenuClick, disabledAutoFallback) => {
   const getCurrentMenu = useCallback(
     (menu) => {
       if (menu && menu.length > 0) {
         const _currentMenu =
           location.pathname === '/'
-            ? findMenu(location.pathname, menu) || getDefaultActiveMenu(menu)
-            : findMenu(location.pathname, menu) || findMenu(fallback, menu) || getDefaultActiveMenu(menu)
+            ? findMenu(location.pathname, menu) || (disabledAutoFallback ? null : getDefaultActiveMenu(menu))
+            : findMenu(location.pathname, menu) ||
+              findMenu(fallback, menu) ||
+              (disabledAutoFallback ? null : getDefaultActiveMenu(menu))
 
         return _currentMenu
       }
@@ -54,7 +56,12 @@ const useMenuCalculator = (menu, location, history, fallback, onMenuClick) => {
     return getCurrentMenu(_menu)
   }, [getCurrentMenu, menu])
 
-  return { currentMenu, selectedMenus, onSelectMenu, defaultPath: getDefaultActiveMenu(menu).path }
+  return {
+    currentMenu,
+    selectedMenus,
+    onSelectMenu,
+    defaultPath: disabledAutoFallback ? null : getDefaultActiveMenu(menu).path
+  }
 }
 
 export default useMenuCalculator
diff --git a/src/theme/index.jsx b/src/theme/index.jsx
@@ -30,6 +30,7 @@ const Layout = ({
   siderBottomRender,
   accordion,
   fallback,
+  disabledAutoFallback = false,
   footer,
   defaultExpandAll,
   pageHeader,
@@ -98,6 +99,7 @@ const Layout = ({
               accordion={accordion}
               onMenuClick={onMenuClick}
               fallback={fallback}
+              disabledAutoFallback={disabledAutoFallback}
               defaultExpandAll={defaultExpandAll}
               pageHeader={pageHeader}
               onToggle={onToggle}