极客园pc项目3 react-router-dom v6 二级路由跳转问题

1.在app文件里配置路由

import {BrowserRouter as Router, Routes, Route} from 'react-router-dom'
import Login from 'pages/Login'
import Home from 'pages/Home'
import ArticleList from "pages/ArticleList";
import ArticlePublish from "pages/ArticlePublish";
import ContentManage from "pages/ContentManage";

function App() {
    return (
        <Router>
            <Routes>
                <Route path='/login' element={<Login/>}></Route>
                <Route path='/home' element={<Home/>}>
                    <Route index element={<ArticleList/>}></Route>
                    <Route path='/home/articlePublish' element={<ArticlePublish/>}></Route>
                    <Route path='/home/contentManage' element={<ContentManage/>}></Route>
                </Route>
            </Routes>
        </Router>
    );
}

export default App;

2.v6的话是在二级路由切换的地方使用 link链接到要跳转的页面

极客园pc项目3 react-router-dom v6 二级路由跳转问题_第1张图片
极客园pc项目3 react-router-dom v6 二级路由跳转问题_第2张图片

你可能感兴趣的:(React学习,react)