在位置“/”处匹配的叶子路由没有元素。这意味着它将默认使用空值呈现，从而导致“空”页面
//App.js File
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import Home from './pages/Home';
// import ReactDOM from "react-dom";
const App = () => {
return (
<Router >
<Routes>
<Route path="/" component={ Home }></Route>
</Routes>
</Router>
)
}
export default App;我的任何React路由器相关代码不工作，我不知道为什么它发生时，我开始插入一些路由程序，所以它显示此错误
7条答案
按热度按时间lmyy7pcs1#
在V6中，你不能再使用
componentprop 了。它被替换成了element：迁移文档中的详细信息。
nx7onnlm2#
我遇到了同样的问题。用元素替换组件，它工作了。
替换为：
用这个
ltqd579y3#
我有同样的错误，但我的修复略有不同，我拼错了元素。
这是它在浏览器控制台中给我的错误
Matched leaf route at location "/MyGames" does not have an element. This means it will render an <Outlet /> with a null value by default resulting in an "empty" page.kt06eoxx4#
很简单：
1.使用
element代替component1.按如下方式 Package 组件：
{<Home/>}而不是{Home}cmssoen25#
在版本6中：
组件已替换为
element，需要关闭"</Route>"https://reactrouter.com/docs/en/v6/getting-started/overview
inb24sb26#
如果你使用react-router-dom V6，这是一个常见的问题。
在代码中，将组件替换为元素将{home}替换为{}
这就变成了...〈Route path="/”element={}〉
这肯定能解决问题。
juud5qan7#
如果您使用的是react-router-dom 6或更高版本，您可能有一个包含父路由和子路由的路由数组
/portal并得到此错误，因为该组件对应于子路由
/:customerid/portal但您还没有仔细阅读路由（及其子路由），因此无法看到这一点。