useRef (1) 썸네일형 리스트형 [React] div 스크롤 맨 밑으로 내리기 / 스크롤 위치 조작하기 - useRef 실시간 채팅창을 구현하다가 마주한 문제였다. 따로 설정을 해두지 않으면 채팅방을 처음 열었을 때 스크롤이 맨 위에서부터 시작되어 최근 메세지를 보려면 직접 사용자가 스크롤을 내려야했다. 물론 이렇게 구현할 수 없으니 리액트에서 스크롤을 어떻게 조작 할 수 있을까? 우선 JavaScript를 기준으로 생각해보면 컨트롤 하고 싶은 영역의 id나 class로 div를 선택해야한다. 그리고 선택한 요소의 스크롤 위치를 제어할 수 있어야하며, 이 과정들은 유저가 채팅방을 오픈했을 때 한번만 실행되도록 해야한다. 이렇게 3가지를 리액트 환경에서 하나씩 해결해보자. 1. useRef로 DOM 선택하기 / target 설정 우선 스크롤을 조작하고 싶은 DOM을 강제로 가져와야한다. 즉 Real DOM을 직접 선택해야하.. 이전 1 다음
