A simple approach to handle scroll-to-top in reactjs with react-router-dom with useEffect hook

react-scroll-to-top.md

• Create a wrapper component

import React, { useEffect } from 'react'
import { withRouter, RouteComponentProps } from 'react-router-dom'

const ScrollTop: React.FC<RouteComponentProps> = ({ history, children }) => {
	useEffect(() => {
		const unlisten = history.listen(() => {
			window.scrollTo(0, 0)
		})
		return () => {
			unlisten()
		}
	}, [history])

	return <>{children}</>
}

const ScrollToTop = withRouter(ScrollTop)

export { ScrollToTop }

• use with router

<Router>
	<ScrollToTop>
		<Switch>
			<Route path="/" component={Home} />
		</Switch>
	</ScrollToTop>
</Router>