react实现同页面三级跳转路由布局

//嵌套路由小案例 布局页面一级路由
import React from 'react'
import {BrowserRouter as Router, Route, Link} from 'react-router-dom' //引入路由要用的组件
import Index from './Index' //二级路由 首页
import Video from './Video' // 二级路由 视频
import Workplace from './Workplace' //二级路由 职场
import './Router.css'
 
//假设是后端获取的动态路由
function AppRouter(){
  let routeConfig = [
    {path:'/',title:'博客首页',exact:true,ponent:Index},
    {path:'/video',title:'视频教程',exact:false,ponent:Video},
    {path:'/workplace',title:'职场技能',exact:false,ponent:Workplace},
  ]
  return(
    <Router>
      <div className='mainDiv'>
        {/ 左侧导航部分