[REACT] React Router를 이용하여 페이지 전환 하기

 

 페이지에서 페이지로 이동하기 위해서는 React Router를 사용하면 된다. 

 

• 터미널에서 프로젝트 폴더에 들어가 yarn add react-router-dom 

react-router-dom을 설치한 후 컴포넌트가 모여있는 app으로 이동하여 화면전환 경로를 만들어 주면 된다.

 

 

1. BrowserRouter -> Switch -> Route순으로 경로를 작성해 준다.
2. Route에 path를 입력하여 주소를 생성한다. (exact를 넣어주어여 정확한 값에 주소가 이동된다)
3. 이동시킬 컴포넌트를 Route안에 묶어 페이지를 구현한다.

 

이 후 useHistory Hook을 이용하여 사이트 이동 주소 함수를 구현한다.

 

 

  goToNote라는 함수안에 history.push로 이동할 주소값 및 데이터를 입력하였다.