기억하기 위한 기록

[mini] my-books 만들기 1.라우팅 설정 본문

Front-end/react

[mini] my-books 만들기 1.라우팅 설정

곽구 2021. 11. 18. 13:29

라우팅을 설정하는 중에 오류가 났다.

먼저는 Switch 부분에서도 오류가 났었는데, 서칭해보니 버젼 때문에 일어나는 문제 같아서

Switch를 Routes로 변경하니 해결되었다.

 

 

그다음은 exact, component에서도 오류가 났다.

 

그래서 온라인강의 질문에 물어보니 해당 문제도 버전 문제같다고 했다.

 

 

코드 수정 전 

<BrowserRouter>
  <Switch>
      <Route exact path="/" component={Home} />
      <Route exact path="/signin" component={Signin} />
      <Route exact path="/add" component={Add} />
  </Switch>
</BrowserRouter>

 

코드수정 후

<BrowserRouter>
  <Routes>
      <Route  path="/" element={ <Home/> } />
      <Route  path="/signin" element={ <Signin/> } />
      <Route  path="/add" element={ <Add/> } />
  </Routes>
</BrowserRouter>

 

오류 없이 라우팅 할 수 있었다.

다만 notfound페이지만 로드되지 않는게 왜때문인지 아직 모르겠다.

 

'Front-end > react' 카테고리의 다른 글

[netlify 배포] react 프로젝트 netlify 로 배포하기  (2) 2021.12.08
[mini] my-books 만들기 2. 로그인 로그아웃  (0) 2021.11.18
ErrorBoundary  (0) 2021.11.18
react/portfolio  (0) 2021.10.16
Netflix / Featured  (0) 2021.10.13