티스토리 뷰

JavaScript & TypeScript

react-router-dom

kingsubin 2020. 12. 13. 13:39

React-Router 

페이지간의 이동에서 사용된다.

 

 

설치

npm install react-router-dom --save

 

# 여기서 왜 -- save 붙이는가 ?

package.json 의 dependecies 안에 모듈이 추가된다.

만약 다른 프로젝트에 package.json 을 옮겨 npm install 하게 되면 dependencies 내의 모듈을 자동으로 설치해준다.

꼭 필요한 모듈을 -- save 명령어와 함꼐 설치하게 되면 다른 프로젝트 시작할때 npm install 한 번으로 필요한 모듈을 한번에 설치할수있다.

 

-> npm version 5 부터는 기본값이라서 굳이 쓸 필요 없음.

 

exact 역할

  • <Route path="/users" component={Users} />
  • <Route path="/users/create component={Createuser} />

 

exact가 없다면 /users 로 이동했을때 Users 컴포넌트로 가는데

/users/create 여기로 갓을때도 Users 컴포넌트로 가게 된다.

원래는 CreateUser로 가야하는데 Router가 부분적으로만 닮아도 같은거라고 인식해 처음보는 Route의 컴포넌트로 이동한다.

그 부분을 없애기 위해서 exact 를 넣어주는 것이다.

 

 

 

 


※ 출처

www.youtube.com/channel/UCFyXA9x8lpL3EYWeYhj4C4Q

reactrouter.com

xtring-dev.tistory.com/11

'JavaScript & TypeScript' 카테고리의 다른 글

TypeORM synchronize true 시 이전 table 까지 생성 문제  (2) 2021.12.26
axios  (0) 2020.12.13
create-react-app :: NPM, NPX  (0) 2020.12.13
React - LifeCycle API  (0) 2020.11.24
React - 시작하기  (0) 2020.11.23