Link 没有路由到组件
Link not routing to component
当我点击 link 时,它会正确更新 URL。但是,与该路线关联的组件不会出现在屏幕上。
index.js:
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<BrowserRouter>
<App />
</BrowserRouter>
);
App.js:
function App() {
return (
<div className="App">
<h1>
React Router Tester
</h1>
<Routes>
<Route path="/Home" component = {Home}/>
</Routes>
<Link to="/Home">
Test
</Link>
</div>
);
}
export default App;
react-router-dom
API 已在最新版本中更改。
而不是
<Route path="/Home" component={Home} />
使用
<Route path="/Home" element={<Home />} />
当我点击 link 时,它会正确更新 URL。但是,与该路线关联的组件不会出现在屏幕上。
index.js:
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<BrowserRouter>
<App />
</BrowserRouter>
);
App.js:
function App() {
return (
<div className="App">
<h1>
React Router Tester
</h1>
<Routes>
<Route path="/Home" component = {Home}/>
</Routes>
<Link to="/Home">
Test
</Link>
</div>
);
}
export default App;
react-router-dom
API 已在最新版本中更改。
而不是
<Route path="/Home" component={Home} />
使用
<Route path="/Home" element={<Home />} />