[리액트] 리액트 라우터 부가기능

1. history 객체

- history 객체는 라우터로 사용된 컴포넌트에 match, location과 함께 전달되는 props 중 하나.

- 이 객체를 통해 컴포넌트 내에 구현하는 메서드에서 라우터 API를 호출 할 수 있음.

- 다른 페이지로 이탈하는 것을 방지해야 할 때 활용

 

2. withRouter 함수

-Higher-order Component

-라우트로 사용된 컴포넌트가 아니어도, match,location,history 객체를 접근할 수 있게 해 줌.

- 현재 자신을 보여주고 있는 라우트 컴포넌트를 기준으로 match가 전달됨.

 

3. Switch 컴포넌트

- 여러 Route를 감싸서 그 중 일치하는 단 하나의 라우터만을 렌더링.

- 모든 규칙과 일치하지 않을 때 보여 줄 Not Found 페이지도 구현할 수 있음.

 

4. NavLink 컴포넌트

- 현재 경로와 Link에서 사용하는 경로가 일치하는 경우, 특정 스타일 혹은 CSS클래스를 적용할 수 있는 컴포넌트

- 링크가 활성화되었을 때의 스카일을 적용할 때는 activeStyle 값을 props로 넣어줌

 - CSS클래스를 적용할 때는 activeClassName 값을 props로 넣어줌.