在一级路由中又内嵌了其他路由，这种关系就叫做嵌套路由。
2. 嵌套路由配置 // @/page/About/index.jsconst About = () => {return (<div>二级路由 About 组件</div>)}export default About // @/page/Layout/index.jsimport { Outlet, Link } from "react-router-dom"const Layout = () => {return (<div>一级路由 Layout 组件<Link to="/about">About</Link>{/* 2. 配置二级路由出口 */}<Outlet></Outlet></div>)}export default Layout // @/router/index.jsimport Login from '../page/Login'import Article from '../page/Article'import { createBrowserRouter } from 'react-router-dom'import Layout from '../page/Layout'import About from '../page/About'const router = createBrowserRouter([{path: '/login',element: <Login></Login>},{// `/:id/:name` 占位符path: '/article/:id/:name',element: <Article></Article>},{path: '/',element: <Layout></Layout>,// 1. 使用 children 属性配置路由嵌套关系children: [{path:'about',element: <About></About>}]}])export default router 3. 默认二级路由当访问的是一级路由时，默认的二级路由组件可以得到渲染。
以下案例希望设置面板组件为二级默认组件得到渲染。
// @/page/Layout/index.jsimport { Outlet, Link } from "react-router-dom"const Layout = () => {return (<div>一级路由 Layout 组件{/* 配置二级路由出口 */}<Link to="/about">About</Link>{/* 2. 相当于根目录即可渲染 Board */}<Link to="/">Board</Link><Outlet></Outlet></div>)}export default Layout // @/router/index.jsimport Login from '../page/Login'import Article from '../page/Article'import { createBrowserRouter } from 'react-router-dom'import Layout from '../page/Layout'import About from '../page/About'import Board from '../page/Board'const router = createBrowserRouter([{path: '/login',element: <Login></Login>},{// `/:id/:name` 占位符path: '/article/:id/:name',element: <Article></Article>},{path: '/',element: <Layout></Layout>,children: [{path:'about',element: <About></About>},// 1. 设置为默认二级路由，一级路由访问的时候，也可以得到渲染。去掉path，设置index属性为true。{index: true,element: <Board></Board>}]}])export default router 4. 404 路由配置 // 写在 router 底部，兜底配置{path: '*',element: <NotFound></NotFound>} 5. 两种路由模式各个主流框架的路由常用的路由模式有俩种，history 模式和 hash 模式, ReactRouter分别由 createBrowerRouter 和 createHashRouter 函数负责创建
路由模式url表现底层原理是否需要后端支持historyurl/loginhistory 对象 + pushState 事件需要hashurl/#/login监听 hashChange 事件不需要
