[REACT]페이지 맨~위로 이동하는 버튼 만들기_ scrollTo

결과물 👆 (흰색버튼누르기)

한페이지에 내용이 너~무 많으면 맨위로 스크롤해서 올라가기 굉장히 귀찮다.
그럴때 아주 유용하게 쓰일 버튼 만들기 gogo🚀

---

window.scrollTo사용하기

1. "맨위로가라" 고 할 함수 선언해주기

const MoveToTop = () => {
  // top:0 >> 맨위로  behavior:smooth >> 부드럽게 이동할수 있게 설정하는 속성
    window.scrollTo({ top: 0, behavior: 'smooth' });
  };

2. 원하는 태그에 onClick 이벤트 걸고, 위의 함수를 콜백으로 넣어주기

 <Img src="/images/Main/up.png" onClick={MoveToTop} />

전체코드보기

3. 끝!! 잘 작동하는지 본다.