puede usar la función Window.scrollTo o element.scrollIntoView para resolver el problema

 useEffect(() => { window.scrollTo(0, 0); }, []);

o si quieres un comportamiento de desplazamiento

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

pero esta no es la mejor manera de hacerlo en cada componente, por lo que puede usar ganchos personalizados para implementarlo y usarlo en todas partes

 import react, { useEffect } from "react"; const useTop = function () { useEffect(() => { window.scrollTo(0, 0); }, []); }; export default useTop;

haga clic para ver la demostración

resolvámoslo a partir de la función element.scrollIntoView y el caso de uso si necesitamos desplazarnos a un elemento pero no conocemos la altura y el ancho del elemento desde la ventana gráfica, por eso solo usamos la función element.scrollIntoView para resolver que. podemos calcular manualmente la altura y el ancho del elemento desde la ventana gráfica usando la función element.getBoundingClientReact pero necesitamos mucho código repetitivo para implementar

con el uso de ganchos personalizados, podemos usar eventos de desplazamiento cuando lo necesitemos

 const useTop = function () { const scroll = (ref) => { ref.current.scrollIntoView({ behaviour: "smooth" }); }; return { scroll }; }; export default useTop;

haga clic para ver la demostración

Prueba esto:

 componentDidMount() { window.scrollTo(0, 0) } useEffect(() => { window.scrollTo(0, 0) }, [])