React 에서 ScrollTo 사용하기

스크린의 특정 위치로 자동 스크롤 되는 기능을 추가하는 방법입니다. 

하나의 페이지에 많은 정보를 나열하고, 메뉴 버튼을 누르면 페이지의 특정 부분으로 스크롤 되어 여러 페이지가 있는 것처럼 사용하거나

React router로 페이지를 이동할 때 이동한 페이지의 최상단에서부터 랜더링되게 하기 위해 사용할 수 있는 방법입니다. 

---

function Example() {

	const scrollTo = (x,y) => {
    	window.scrollTo(x,y);
    }
    
    return(
    	<button onClick={scrollTo(0,50}>Scroll to x=0, y=50</button>
    );
    
}

컴포넌트를 클릭하면 scrollTo 함수에 스크롤 하고자 하는 x축 좌표 값과 y 축 좌표값을 전달하면 됩니다.

router 이동시 항상 최상단으로 이동하기 위해선 x,y 값을 따로 전달하지 않고, 그냥 0,0 을 전달하시면 됩니다.

---

감사합니다 :)