前端学习笔记202308学习笔记第八十捌天-其余路径的配置代码

import React, { lazy } from "react"
import { Navigate } from "react-router-dom"


const Fang = lazy(() => import("../views/fang"))
const Home = lazy(() => import("../views/home"))
const Geyao = lazy(() => import("../views/Geyao"))
const withLoadingComponent = (comp: JSX.Element) => {
    return (
        <React.Suspense fallback={<div>Loading...</div>}>
            {comp}
        </React.Suspense>
    )

}
const routes = [{
    path: "/",
    element: <Navigate to="/geyao" />
},
{
    path: "*",
    element: <Navigate to="/geyao" />
},
{
    path: "/",
    element: <Home />,
    children: [{
        path: "/geyao",
        element: withLoadingComponent(<Geyao />),
    }, {
        path: "/fang",
        element: withLoadingComponent(<Fang />),
    }]
}]

export default routes

posted @ 2023-09-12 15:28  前端导师歌谣  阅读(11)  评论(0)    收藏  举报  来源