개발, 심리, 투자 그리고 일상의 생각 나눔
이미지 파일을 선택해서 해당 이미지를 웹 상에서 바로 볼 수 있게 해야 할 때가 있습니다. React 이미지 미리보기 구현 방법을 살펴보겠습니다. React 이미지 미리보기 구현에 필요한 재료들 이미지 미리보기를 하기 위해서는 우선 파일을 선택할 수 있는 <input type=”file”> HTML 엘리먼트가 필요합니다. 아래 그림 1에서 파란 상자로 표시되어 있습니다. 그리고 두번째로 선택한 이미지를 보여줄 <img> 태그가 … Read more
React를 이용해서 개발하다보면 특정 HTML Element에 접근해야 하는 경우가 있습니다. React 엘리먼트 접근/제어 방법인 ref 사용법을 살펴보도록 하겠습니다. React 엘리먼트 접근을 위한 ref property React로 개발하면서 엘리먼트에 직접 접근하거나 제어해야 하는 경우에 useRef를 사용할 수 있습니다. 보통 Javascript에서는 document.getElementById()와 같은 메서드를 활용해서 객체에 직접 접근하고 제어합니다만, React에서는 useRef()를 이용해서 해당 엘리먼트에 접근합니다. 예제: 보이지 않는 … Read more