提交 18db76fd authored 作者: 王鹏飞's avatar 王鹏飞

chore: update

上级 08c9ee29
...@@ -3,7 +3,7 @@ import { ErrorBoundary } from 'react-error-boundary' ...@@ -3,7 +3,7 @@ import { ErrorBoundary } from 'react-error-boundary'
import { Button } from 'antd' import { Button } from 'antd'
import './App.less' import './App.less'
import { GetroutesDyamic } from '@/routes/index' import { GetRoutesDynamic } from '@/routes/index'
function fallbackRender({ error, resetErrorBoundary }) { function fallbackRender({ error, resetErrorBoundary }) {
return ( return (
...@@ -20,7 +20,7 @@ function App() { ...@@ -20,7 +20,7 @@ function App() {
return ( return (
<ErrorBoundary fallbackRender={fallbackRender}> <ErrorBoundary fallbackRender={fallbackRender}>
<Suspense> <Suspense>
<GetroutesDyamic /> <GetRoutesDynamic />
</Suspense> </Suspense>
</ErrorBoundary> </ErrorBoundary>
) )
......
...@@ -18,7 +18,7 @@ import { generateToAntdMenus } from '@/utils/breadCrumb' ...@@ -18,7 +18,7 @@ import { generateToAntdMenus } from '@/utils/breadCrumb'
const { Header, Content } = Layout const { Header, Content } = Layout
function generateMenus(items = [], maxLevel = 2, level = 1) { function generateMenus(items = [], maxLevel = 2, level = 1) {
return items.map(item => { return items.map((item) => {
const children = level < maxLevel && item.childs ? generateMenus(item.childs, maxLevel, level + 1) : null const children = level < maxLevel && item.childs ? generateMenus(item.childs, maxLevel, level + 1) : null
return { key: item.id + '', path: item.front_url, label: <Link to={item.front_url}>{item.name}</Link>, children } return { key: item.id + '', path: item.front_url, label: <Link to={item.front_url}>{item.name}</Link>, children }
}) })
...@@ -50,7 +50,7 @@ export default function AppLayout() { ...@@ -50,7 +50,7 @@ export default function AppLayout() {
} }
useEffect(() => { useEffect(() => {
(async () => { ;(async () => {
await getSSOToken() await getSSOToken()
await getMenu() await getMenu()
})() })()
......
import { lazy } from 'react' import { lazy } from 'react'
import { Navigate } from 'react-router-dom' // import { Navigate } from 'react-router-dom'
import { authComponent } from './lazyLoadAndDelay' // 添加一个固定的延迟时间,以便你可以看到加载状态 import { authComponent } from './lazyLoadAndDelay' // 添加一个固定的延迟时间,以便你可以看到加载状态
import Layout from '@/layout/index' import Layout from '@/layout/index'
...@@ -24,8 +24,8 @@ const baseRouter = [ ...@@ -24,8 +24,8 @@ const baseRouter = [
Component: lazy(() => import('@/pages/user-module/login')) Component: lazy(() => import('@/pages/user-module/login'))
} }
] ]
}, }
{ path: '*', element: <Navigate to="/" /> } // { path: '*', element: <Navigate to="/" /> }
] ]
export default baseRouter export default baseRouter
import { useEffect } from 'react'; import { useEffect } from 'react'
import { useRoutes, Navigate } from 'react-router-dom'; import { useRoutes, Navigate } from 'react-router-dom'
import { filterAsyncRouter } from './lazyLoadAndDelay'; import { filterAsyncRouter } from './lazyLoadAndDelay'
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux'
import baseRouter from './baseRouter'; import baseRouter from './baseRouter'
const addDefaultNavigation = (menuRoutes) => { const addDefaultNavigation = (menuRoutes) => {
menuRoutes.forEach((item) => { menuRoutes.forEach((item) => {
const children = item.children; const children = item.children
if (children && children.length > 0) { if (children && children.length > 0) {
// 如果有子项,递归调用 addDefaultNavigation // 如果有子项,递归调用 addDefaultNavigation
addDefaultNavigation(children); addDefaultNavigation(children)
// 在 children 数组的开头添加默认导航项 // 在 children 数组的开头添加默认导航项
children.unshift({ children.unshift({
index: true, index: true,
element: <Navigate to={children[0].path} />, element: <Navigate to={children[0].path} />
}); })
} }
}); })
return menuRoutes; return menuRoutes
}; }
const GetroutesDyamic = () => { const GetRoutesDynamic = () => {
// 合并路由 // 合并路由
const { menuRouter } = useSelector((state) => state.user); const { menuRouter } = useSelector((state) => state.user)
useEffect(() => { useEffect(() => {
if (menuRouter?.length) { if (menuRouter?.length) {
const menuRoutes = filterAsyncRouter(menuRouter); const menuRoutes = filterAsyncRouter(menuRouter)
const hasRoute = baseRouter[0].children; const hasRoute = baseRouter[0].children
const newMenus = addDefaultNavigation(menuRoutes); const newMenus = addDefaultNavigation(menuRoutes)
const firstObj = { const firstObj = {
index: true, index: true,
element: <Navigate to={newMenus[0].path} />, element: <Navigate to={newMenus[0].path} />
};
baseRouter[0].children = [firstObj, ...newMenus, ...hasRoute];
} }
}, [menuRouter]); baseRouter[0].children = [firstObj, ...newMenus, ...hasRoute]
const element = useRoutes(baseRouter); }
}, [menuRouter])
console.log(baseRouter)
const element = useRoutes(baseRouter)
return <>{element}</>; return <>{element}</>
}; }
export { GetroutesDyamic }; export { GetRoutesDynamic }
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论