코드코코

1. history 객체 - history 객체는 라우터로 사용된 컴포넌트에 match, location과 함께 전달되는 props 중 하나. - 이 객체를 통해 컴포넌트 내에 구현하는 메서드에서 라우터 API를 호출 할 수 있음. - 다른 페이지로 이탈하는 것을 방지해야 할 때 활용 2. withRouter 함수 -Higher-order Component -라우트로 사용된 컴포넌트가 아니어도, match,location,history 객체를 접근할 수 있게 해 줌. - 현재 자신을 보여주고 있는 라우트 컴포넌트를 기준으로 match가 전달됨. 3. Switch 컴포넌트 - 여러 Route를 감싸서 그 중 일치하는 단 하나의 라우터만을 렌더링. - 모든 규칙과 일치하지 않을 때 보여 줄 Not Found..

//라우터 관련 라이브러리 설치 yarn add react-router-dom //BrowserRouter 불러오기 import { BrowserRouter } from 'react-router-dom'; //index.js ReactDOM.render( //BrowserRouter컴포넌트로 묶어주기 , document.getElementById('root') ); Route: 특정 주소에 컴포넌트 연결하기 Link: 누르면 다른 주소로 이동시키기 - 리액트 라우터를 사용할 때 a태그 사용금지 - a 태그의 기본적인 속성은 페이지를 이동시키면서, 페이지를 아예 새로 불러오는 것이다. a 태그의 속성때문에 앱이 지니고있는 상태들도 초기화되고, 렌더링된 컴포넌트도 모두 사라지고 새로 렌더링을 하게된다. - ..