react-router-dom 嵌套路由的实现

import React from "react"
import ReactDOM from "react-dom"
import App from "./App.jsx"
import "babel-polyfill"
const root = document.getElementById("app")
if (root !== null) {
 ReactDOM.render(<App />, document.getElementById("app"))
}

import React, { Fragment, Component } from "react"
import {
 BrowserRouter as Router,
 Switch,
 Route,
 NavLink,
 Redirect,
 Link,
 withRouter,
} from "react-router-dom"
// 开始引入各种自定义的组件
import Index from "./pages/platform/index"
//404页面
import ErrorPage from "./pages/ErrorPage"
import Login from "./pages/login/index"
import routes from "./routes/index"


class BaseLayout extends Component {
 constructor(props) {
  super(props)
  }
  
  render(){
    return(
    <Fragment>
      <ul>
     {routes.map((val,index))=>{
       return(
       <li key={index}>
       <Link to={val.path}>{val.authName}</Link>
       </li>
       )
     }
    </ul>
      
       <Switch>
        {routes.map((route, key) => {
         if (route.exact) {
          return (
           <Route
            key={key}
            exact
            path={route.path}
            ponent={(props) => {
             return (
              <route.ponent {...props} routes={route.routes} />
             )
            }}
           >
            {/ <route.ponent />