无法在 react-router-dom 中路由页面

Question

我想使用BrowserRouter组件，在React.Js中处理客户端路由

在这种情况下，当用户导航到网站的每个URL时，这些页面组件将被呈现。但是根目录或任何路径都不会显示任何内容。

下面是app.js的代码

import React from "react";
import GlobalStyle from "./globalStyle.js";
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
//Pages
import Home from "./Pages/Home";
import Pricing from "./Pages/PricingPage.js";
import Signup from "./Pages/SignupPage.js";
function App() {
return (
<Router>
<GlobalStyle />
Test
<Routes>
<Route exact path="/" component={Home} />
<Route path="/signup" component={Signup} />
<Route path="/pricing" component={Pricing} />
</Routes>
</Router>
);
}
export default App;

Answer 1

如果您使用的是react-router-domv6，路由应该是:

<Route exact path="/" element={<Home />} />
<Route path="/signup" element={<Signup />} />
<Route path="/pricing" element={<Pricing />} />

component为element，它们的值在标签中。