Javascript React路由器dom v5默认路由不'；行不通

我将react router dom v5与material ui一起使用，我的路由如下所示：

import React from 'react'
import { BrowserRouter, Route, Switch } from 'react-router-dom'
import Layout from '../components/layout'
import Login from '../screens/Login'
import NotFound from '../screens/NotFound'
import routes from './routes'

const DynamicRoutes = () => {
  return (
    <>
      {Object.values(routes).map(({ component, path }) => (
        <Route exact path={path} key={path} component={component} />
      ))}
    </>
  )
}

const Router = () => {
  return (
    <BrowserRouter>
      <Switch>
        <Route exact path="/login" component={Login} />
        <Layout>
          <DynamicRoutes />
        </Layout>
        <Route path="*" component={NotFound} />
      </Switch>
    </BrowserRouter>
  )
}

export default Router

从“React”导入React
从“react router dom”导入{BrowserRouter，Route，Switch}
从“../components/Layout”导入布局
从“../screens/Login”导入登录名
从“../screens/NotFound”导入NotFound
从“/routes”导入路由
常量炸药=（）=>{
返回(
{Object.values（routes.map）（{component，path}）=>(
))}
)
}
常数路由器=（）=>{
返回(
)
}
导出默认路由器

---

我已经尝试过

，但都没有成功。有人能帮我吗？其余的路由工作正常，但当我键入假路由时，不会转到

未找到
屏幕。
发生这种情况，因为
的所有子元素都应该是
或
元素。
您可以在react路由器dom中查看更多信息

因此，代码的一个解决方案是这样做：

<BrowserRouter>
      <Switch>
        <Route exact path="/login" component={Login} />
        {Object.values(routes).map(({ Component, path }) => (
          <Route exact path={path} key={path}>
            <Layout>
              <Component />
            </Layout>
          </Route>
        ))}
        <Route path="*" component={NotFound} />
      </Switch>
</BrowserRouter>


{Object.values（routes.map）（{Component，path}）=>(
))}

*对于routes对象数组，Component属性必须具有较高的
C

您可以查看此代码。
您好，这对我来说是个有趣的问题。感谢分享您已经尝试过的解决方案。我的猜测是，当您尝试“伪路由”时，实际上您不会键入或机械地重定向，但您可以通过尝试在组件内部重定向来从
布局
组件尝试重定向。我说得对吗？您好@GiorgiGvimradze，我在我定义的一条路径中，即
Layout
组件的内部，我想从那里加载
NotFound
组件。假设我在一条名为
/home
的路线上，该路线位于
布局的内部，然后您键入url
/home/random text
，然后我不会被重定向到
NotFound
屏幕。我能做什么？谢谢你的解释嗨@rubenmondom，是的，没错*我的示例代码带有错误的链接。我刚刚纠正了，对不起。