21.11.06 20:43 작성
·
1.3K
0
코드를 컴파일하고 실행하면 vscode자체에서는 실행이 되는데 정작 localhost:3000에 접속하면 이렇게 뜹니다. 소스코드는 아래와 같습니다.
import React from 'react';
import {
BrowserRouter as Router,
Routes,
Route,
Link
} from "react-router-dom";
function App() {
return (
<Router>
<div>
<ul>
<li>
<Link to="/">Home</Link>
</li>
<li>
<Link to="about">About</Link>
</li>
<li>
<Link to="dashboard">Dashboard</Link>
</li>
</ul>
<hr />
<Routes>
<Route exact path="/">
<Home />
</Route>
<Route path="/about">
<About />
</Route>
<Route path="/dashboard">
<Dashboard />
</Route>
</Routes>
</div>
</Router>
);
}
export default App;
function Home() {
return (
<div>
<h2>Home</h2>
</div>
);
}
function About() {
return (
<div>
<h2>About</h2>
</div>
);
}
function Dashboard() {
return (
<div>
<h2>Dashboard</h2>
</div>
);
}
답변 2
2
위의 코드를 붙여넣기 했는데 오류가 이렇게 뜹니다..ㅠ
src\App.js
Line 29:10: 'Routes' is not defined react/jsx-no-undef
Line 39:2: 'Topics' is not defined react/jsx-no-undef
Search for the keywords to learn more about each error.
0
2021. 11. 06. 23:29
혹시 코드 좀 보내주실 수 있나요? 그냥 삭제하고 실행하니까 Error: A <Route> is only ever to be used as the child of <Routes> element, never rendered directly. Please wrap your <Route> in a <Routes>.라고 뜨네요...
실행한 환경/코드 공유드립니다~
react :^17.0.2
react-router-dom : ^5.3.0
2021. 11. 07. 22:00
감사합니다! 덕분에 해결할 수 있었습니다.