react-router V6 路由配置（嵌套路由）无比简单无比快！

抚月

于 2024-05-13 01:48:57 发布

阅读量151

点赞数 2

分类专栏： react 文章标签： react.js javascript 前端

本文链接：https://blog.csdn.net/qq_38359034/article/details/138775511

版权

react 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

新建routes.js

import { createBrowserRouter , Navigate } from 'react-router-dom';

import Home from './home/Home';
import Test from './home/Test';

const routes = createBrowserRouter([
    {
        path: "/index",
        element: <Home />,
        children: [
            {
                path: "test",
                element: <Test />,
            }
        ]
    },
    {
        path: "/",
        element: <Navigate to='/index' />
    },
])

export default routes;

在app或者index中加入路由

import './App.css';
import routes from './routes';
import { RouterProvider } from 'react-router-dom'; 

function App() {
  return (
    <RouterProvider router={routes} />
  );
}

export default App;