Router 실습

페이지 컴포넌트 불러오기

Link 컴포넌트 사용하기

NavLink 컴포넌트 사용하기

NavLink 활용 (1)

NavName 속성 사용해서 변수에 담아서 사용

이 방법으로 사용하게 되면 App에서 사용되는 컴포넌트에만 스타일이 적용된다. 이 방법보다는 활용(2)와 같이 style 파일을 만들어서 공통적으로 스타일을 적용하는 것이 좋다.

NavLink 활용 (2)

Style 파일을 만들어서 NavLink 컴포넌트에 일괄적으로 스타일 적용

Switch 컴포넌트 사용 전

Switch 컴포넌트를 사용하지 않고 Route와 Redirect를 사용할 경우 올바른 url를 입력했지만 계속해서 Redirect에 설정한 to속성 값으로 이동한다.

Switch 컴포넌트 사용 후