Issue #6 Implementado scroll global
This commit is contained in:
17
src/components/ScrollToTop.jsx
Normal file
17
src/components/ScrollToTop.jsx
Normal 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);
|
||||
@@ -9,6 +9,7 @@ import './styles/tabs.scss';
|
||||
|
||||
import {Nav} from "./components/Nav";
|
||||
import {SearchBar} from "./components/SearchBar";
|
||||
import {ScrollToTopRouter} from "./components/ScrollToTop";
|
||||
|
||||
import {Search} from './views/Search';
|
||||
import {ArtistView} from "./views/Artist";
|
||||
@@ -41,6 +42,7 @@ const NoRoute = (props) => {
|
||||
const App = () => (
|
||||
<main>
|
||||
<BrowserRouter>
|
||||
<ScrollToTopRouter/>
|
||||
<Nav/>
|
||||
<Switch>
|
||||
<Route path='/search/:who?' component={Search}/>
|
||||
|
||||
Reference in New Issue
Block a user