안녕하세요 상훈입니다.
React.js 에서 Route를 사용하는데, 아래와 같은 에러가 발생하였습니다.
Uncaught Error: [Searchpage] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>
내용인 즉슨, Routes 컴포넌트 내에는 자식 요소로 Route 혹은 React.Fragment 만 들어갈 수 있다는 뜻입니다.
그러므로, 코드를 변경하도록 하겠습니다.
자세히 확인해보시면,
Route 컴포넌트 내에 element라는 속성을 삽입하여 그 속에 객체로 원하는 컴포넌트들을 삽입하였습니다.
이상입니다.
도움이 되셨다면 광고 한번 클릭해주세요. 블로그 운영에 큰 힘이 됩니다. 감사합니다.
안녕하세요 상훈입니다.
React.js 에서 Switch 를 사용하려고 하는데 아래와 같은 에러가 발생하였습니다.
ERROR in ./src/App.js 20:37-43 export 'Switch' (imported as 'Switch') was not found in 'react-router-dom' (possible exports: BrowserRouter, HashRouter, Link, MemoryRouter, NavLink, Navigate, NavigationType, Outlet, Route, Router, Routes, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RouteContext, createPath, createRoutesFromChildren, createSearchParams, generatePath, matchPath, matchRoutes, parsePath, renderMatches, resolvePath, unstable_HistoryRouter, useHref, useInRouterContext, useLinkClickHandler, useLocation, useMatch, useNavigate, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRoutes, useSearchParams)
에러의 원인은 React의 버전이 올라가면서 Switch 가 Routes 로 변경되었다고 합니다.
사용 방법은 똑같으니, Switch로 작성하셨던 부분을 Routes로 변경해주시면 됩니다.
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
react-router-dom 의 기능에서도 Switch 대신에 Routes를 작성해주시면 됩니다.
이상입니다.
도움이 되셨다면 광고 한번 클릭해주세요. 블로그 운영에 큰 힘이 됩니다. 감사합니다.