반응형
react-router-dom 6 버전에서 Switch가 Routes로 변경되었다.
# react-router-dom 5.x
import { HashRouter as Router, Switch, Route } from "react-router-dom";
import Auth from "routes/Auth";
import Home from "routes/Home";
const AppRouter = ({ isLoggedIn }) => {
return (
<Router>
<Switch>
{isLoggedIn ? (
<Route exact path="/">
<Home />
</Route>
): (
<Route exact path="/">
<Auth />
</Route>
)}
</Switch>
</Router>
);
};
# react-router-dom 6.x
import { HashRouter as Router, Routes, Route } from "react-router-dom";
import Auth from "routes/Auth";
import Home from "routes/Home";
const AppRouter = ({ isLoggedIn }) => {
return (
<Router>
<Routes>
{isLoggedIn ? (
<Route exact path="/" element={<Home/>} />
): (
<Route exact path="/" element={<Auth/>} />
)}
</Routes>
</Router>
);
};
반응형
'Basic > React' 카테고리의 다른 글
[React] Realtime으로 데이터 주고받기 (0) | 2023.02.09 |
---|---|
vite에서 proxy 설정하기 (0) | 2023.02.07 |
[React] <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment> (0) | 2023.02.01 |
[React] SPA 프레임 워크 (0) | 2023.01.24 |
[React] local에서 실행 시 render가 두 번 되고 있어요! (0) | 2023.01.23 |