react router (1) 썸네일형 리스트형 [TIL] react-router의 Link와 a 태그 react-router에서 화면을 이동할 때는 Link 태그를 사용하여 to 속성에 이동할 주소 정보를 작성한다. 하지만 우리는 이미 페이지 이동 기능을 갖고 있는 태그인 a 태그를 알고 있다. 두 기능 사이에는 어떤 차이가 있을까? 결론부터 말하면, 페이지 새로고침 여부가 이 2가지의 차이점이다. Link 태그는 브라우저의 주소만 바꿀 뿐 페이지 자체를 새로고침하지는 않는다. 반면, a 태그는 브라우저의 주소를 이동하며 페이지 자체를 새로고침한다. 페이지 새로고침 여부는 웹 페이지에서 중요하다. 페이지가 새로고침될 경우 현재 렌더링되어 있는 컴포넌트가 모두 사라지고 새로 컴포넌트가 렌더링되게 된다. 이렇게 되면 컴포넌트에 설정되어 있는 state 등이 모두 날아가기 때문이다.[1] Link 태그를 사용.. 이전 1 다음