Scroll to top on location change

This commit is contained in:
Nick Pegg 2017-10-07 17:46:52 -07:00
parent 01eb8c8d3c
commit 6b0c0f2d88

View file

@ -2,7 +2,8 @@ import React, { Component } from 'react';
import {
BrowserRouter as Router,
Route,
Switch
Switch,
withRouter
} from 'react-router-dom';
import hljs from 'highlight.js';
@ -26,6 +27,7 @@ class App extends Component {
render() {
return (
<Router>
<ScrollToTop>
<div className="App">
<Header title={this.title} />
@ -56,6 +58,7 @@ class App extends Component {
<Footer />
</div>
</ScrollToTop>
</Router>
);
}
@ -69,6 +72,19 @@ class App extends Component {
}
}
class ScrollToTop extends Component {
componentDidUpdate(prevProps) {
if (this.props.location !== prevProps.location) {
window.scrollTo(0, 0);
}
}
render() {
return this.props.children
}
}
ScrollToTop = withRouter(ScrollToTop);
// Dummy About page just for playing around with ReactRouter
class About extends Component {
render () {