Issue #6 Implementado scroll global

This commit is contained in:
Daniel Cortes
2020-06-19 11:50:26 -04:00
parent 76280a4f8c
commit 291ec0aa53
2 changed files with 19 additions and 0 deletions

View File

@@ -0,0 +1,17 @@
import { useEffect } from 'react';
import { withRouter } from 'react-router-dom';
export const ScrollToTop = ({ history }) => {
useEffect(() => {
const unlisten = history.listen(() => {
window.scroll({top:0, left:0, behavior:'smooth'});
});
return () => {
unlisten();
}
}, []);
return (null);
}
export const ScrollToTopRouter = withRouter(ScrollToTop);

View File

@@ -9,6 +9,7 @@ import './styles/tabs.scss';
import {Nav} from "./components/Nav"; import {Nav} from "./components/Nav";
import {SearchBar} from "./components/SearchBar"; import {SearchBar} from "./components/SearchBar";
import {ScrollToTopRouter} from "./components/ScrollToTop";
import {Search} from './views/Search'; import {Search} from './views/Search';
import {ArtistView} from "./views/Artist"; import {ArtistView} from "./views/Artist";
@@ -41,6 +42,7 @@ const NoRoute = (props) => {
const App = () => ( const App = () => (
<main> <main>
<BrowserRouter> <BrowserRouter>
<ScrollToTopRouter/>
<Nav/> <Nav/>
<Switch> <Switch>
<Route path='/search/:who?' component={Search}/> <Route path='/search/:who?' component={Search}/>