React-Router : IndexRoute의 목적은 무엇입니까?


102

IndexRouteIndexLink 사용 목적이 무엇인지 이해하지 못합니다 . 어떤 경우에도 About 경로가 활성화되지 않으면 아래 코드가 Home 구성 요소를 먼저 선택한 것 같습니다.

<Route path="/" component={App}>
  <IndexRoute component={Home}/>
  <Route path="about" component={About}/>
</Route>

vs

<Route path="/" component={App}>
  <Route path="home" component={Home}/>
  <Route path="about" component={About}/>
</Route>

첫 번째 경우의 장점 / 목적은 무엇입니까?


Home경로가 아닌 경우 첫 번째 예에서 선택되는 이유는 무엇 /home입니까? 문서에서 설명을 확인하십시오 : github.com/rackt/react-router/blob/master/docs/guides/basics/…
Michelle Tilley

main이 탐색 모음이고 Home 및 About이 탐색 모음에서 클릭 할 수있는 기본 페이지라고 상상할 수 있습니다.
Nick Pineda

2
위의 예에서는 자식 으로 전달 된 상태로 /렌더링 App됩니다 Home. 아래의 예에서 예정 /으로 렌더링 App으로 Home 또는하는 것은 About렌더링되지되고있는 자신의 경로 중 어느 것도 일치하기 때문에.
Michelle Tilley 2015 년

2
오! 내가 당신에게 신용을 줄 수 있도록 대답으로 넣어 주시겠습니까? 감사합니다!
Nick Pineda

3
v0.13에서 v1.0으로 변경하면서 이름을 DefaultRoute에서 IndexRoute. 나는 '기본값'이 목적을 더 잘 설명한다고 생각합니다. github.com/rackt/react-router/blob/master/...
갇힌

답변:


101

위의 예에서는 자식 으로 전달 된 상태로 /렌더링 App됩니다 Home. 아래의 예에서 예정 /으로 렌더링 App으로 둘 다 Home 아니다하는 것은 About자신의 경로 중 어느 것도 일치하기 때문에, 렌더링되고 있지.

이전 버전의 React Router의 경우 관련 버전의 색인 경로 및 색인 링크 페이지 에서 자세한 정보를 확인할 수 있습니다 . 버전 4.0부터 React Router는 더 이상 IndexRoute동일한 목표를 달성하기 위해 추상화를 사용하지 않습니다 .


3
그렇다면 실제로이 기능을 어떻게 사용할 수 있을까요?
seasonqwe

1
예를 들어 하나의 상위 컨테이너와 여러 개의 하위 경로를 만들고 이러한 하위 경로 중 하나를 기본값 (IndexRoute)으로 설정할 수 있습니다. 또는, 그가 뭔가 (NO IndexRoute 다음)를 선택하는 것입니다 우리는 사용자를 암시하는 기본 하위 경로와 필요를 필요하지 않은 경우
올가 Gnatenko

1
AlexHopeO'Connor 감사 @, 나는 대답 하반기 업데이트 한
미셸 틸리

어렸을 때 통과 한 것은 정확히 무엇을 의미합니까? 배경에로드? 소품에 액세스 할 수 있습니까? 다른?
StLia
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.