[React] <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>

 

 

✅ react-router-dom v6 부터

• Switch 대신 Routes를 사용
• Route 안에 component 대신 element 사용

그리고 <Routes> 자식으로는 <Route>만 가능하다. 따라서 v6 부터는 다음과 같이 사용한다.

import {
  BrowserRouter as Router,
  Routes,
  Route,
  Link
} from "react-router-dom";

function App() {
  return (
    <div className="App">
      <Router>
        <Routes>
          <Route path="/" element={ <LandingPage /> } />
          <Route path="/login" element={ <LoginPage /> } />
          <Route path="/register" element={ <RegisterPage /> } />
        </Routes>
      </Router>
    </div>
  );
}

export default App;