Switch는 어떤 일을 하는가
는 처음 매칭되는 하나의 루트만을 리턴한다.
exact는 정확하게 매칭되는 루트들의 개수를 리턴한다.
예를 들어:
<Switch>
<Route exact path="/animals" component={Animals} />
<Route path="/animals/fish" component={Fish} />
<Route component={Missing} />
</Switch>
<Route path="/animals" component={Order} />
Missing 컴포넌트가 Switch 바깥에 있으면 단 하나의 루트만을 리턴한다.
exact와 함께 쓰이면 "/animals" 루트는 "/animals/fish"와 같이 "animals"를 포함하는 모든 루트를 잡아내지 않을 것이다.
exact 없이 쓰이면 "/animals/fish" 루트는 "animals/fish/cod", "animals/fish/salmon" 등과 같은 Fish 컴포넌트를 리턴할 것이다.
exact 없이 문 바깥에 있기 때문에 Order 컴포넌트는 "/animals"를 포함하는 모든 path를 렌더한다.
출처: stackoverflow(https://stackoverflow.com/questions/45122800/react-router-switch-behavior)
'웹' 카테고리의 다른 글
object.create과 function constructor pattern 차이 (0) | 2020.05.06 |
---|---|
npx create-react-app 이 작동하지 않을 때 (0) | 2020.04.30 |
TypeScript 시작하기 (0) | 2020.03.28 |
자바스트립트 this, DOM (0) | 2019.10.16 |
자바스크립트 작동 방법 (0) | 2019.10.14 |
댓글