scroll to top if page url changed.

src/App.tsx

@@ -1,19 +1,14 @@
 import React, { Component } from 'react';
 import { BrowserRouter } from 'react-router-dom';
+import AppRoot from './components/AppRoot';
 import './App.css';
 
-import Header from './components/Header';
-import Footer from './components/Footer';
-import Container from './components/Container';
-
 class App extends Component {
   render() {
     return (
       <BrowserRouter>
-        <Header />
-        <Container />
-        <Footer />
-      </BrowserRouter>
+        <AppRoot />
+      </BrowserRouter >
     );
   }
 }

src/components/AppRoot.tsx

@@ -0,0 +1,29 @@
+import React, { Component } from 'react';
+import { RouteComponentProps, withRouter } from 'react-router-dom';
+import Header from './Header';
+import Container from './Container';
+import Footer from './Footer';
+
+interface Props extends RouteComponentProps { }
+interface State { }
+
+class AppRoot extends Component<Props, State> {
+
+    componentDidUpdate(prevProps: Props) {
+        if (this.props.location !== prevProps.location) {
+            window.scrollTo(0, 0);
+        }
+    }
+
+    render() {
+        return (
+            <>
+                <Header />
+                <Container />
+                <Footer />
+            </>
+        );
+    }
+}
+
+export default withRouter(AppRoot);