Как сделать кнопку плавного скролла вверх страницы (React)?

Question

[Denis_8106]

Ребята, тривиальный вопрос - как сделать на React кнопку плавной прокрутки. Я сделал как-то так:

import React from 'react';
import './BtnScrollUp.scss'

function BtnScrollUp() {
	
	const handlerScrollUp = () => {
		if (document.body.scrollTop > 0 || document.documentElement.scrollTop > 0) {
			window.scrollBy(0, -50);
			setTimeout(handlerScrollUp, 10);
		}
	}
	
	return (
		<div className={'btn-scroll-up'} onClick={handlerScrollUp}>&#9650;</div>
	);
}

export default BtnScrollUp;

Но хочется сделать более красивое решение, не хочется напрямую стучаться в DOM.

Answer 1

[Mikhail Osher]

Не надо никаких рекурсивных таймаутов. Просто один вызов.

window.scrollTo({
  top: 0,
  left: 0,
  behavior: 'smooth',
});