Context의 Provider와 유사한 역할을 한다. 브라우저의 history stack 혹은 hashchange 이벤트와 연동되어있다. 아래 나오는 컴포넌트들은 전부 Context의 Consumer와 유사한 역할을 한다. (즉, 상위 Router 엘리먼트와 연동되어, 상태를 받아오거나 상태를 바꿀 수 있다.)
a 태그로 렌더링되는 컴포넌트. href 역할을 하는 to prop을 통해 어떤 주소로 이동할지를 지정해줄 수 있다. 상위에서 BrowserRouter가 사용되면 history.pushState를 통해 주소를 바꾸고, HashRouter가 사용되면 location.hash를 바꾼다.
Route 컴포넌트는 react-router의 핵심적인 구성요소로, 주소에 따른 선택적 렌더링을 할 때 사용된다. path prop과 주소가 일치할 때에만 렌더링된다. component prop을 통해 렌더링하고 싶은 컴포넌트를 넘겨줄 수 있다. 이 때, 여기에 주어진 컴포넌트는 match prop을 받고 이 prop으로 들어오는 객체를 통해 라우팅과 관련된 다양한 정보를 얻어올 수 있다. 이 밖에 많은 기능이 내장되어 있다.
렌더링되었을때 주소가 바뀌는 컴포넌트. Link 컴포넌트와 함께 주소를 바꾸는 데에 사용된다. Link 컴포넌트는 사용자가 링크를 클릭해야만 주소가 바뀌는 데 반해, Redirect 컴포넌트는 마운트되는 순간 주소가 바뀐다는 차이점이 있다. from prop과 to prop을 받을 수 있고 현재 주소가 from과 일치하면 to 주소로 이동한다. from prop을 생략한 경우 바로 to 주소로 이동한다.
자식 노드에 Route, Redirect 컴포넌트가 있을 때, 처음으로 주소가 일치하는 Route 혹은 Redirect 하나만 동작하게 만드는 컴포넌트. 여기서 '주소의 일치'란, 브라우저 주소표시줄의 주소가 Route 컴포넌트의 path prop, Redirect 컴포넌트의 from prop과 일치하는 것을 말하는 것이다.