Fix route navigation scroll position by adding global ScrollToTop
This commit is contained in:
parent
54c22ca24b
commit
f31f0f3a05
@ -8,10 +8,13 @@ import SupportPage from "./pages/SupportPage";
|
|||||||
import DiscoverySetPage from "./pages/DiscoverySetPage";
|
import DiscoverySetPage from "./pages/DiscoverySetPage";
|
||||||
import Footer from "./components/Footer";
|
import Footer from "./components/Footer";
|
||||||
import SupportChatbot from "./components/SupportChatbot";
|
import SupportChatbot from "./components/SupportChatbot";
|
||||||
|
import ScrollToTop from "./components/ScrollToTop";
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
<ScrollToTop />
|
||||||
|
|
||||||
<Routes>
|
<Routes>
|
||||||
<Route path="/" element={<LandingPage />} />
|
<Route path="/" element={<LandingPage />} />
|
||||||
<Route path="/duft/:perfumeSlug" element={<ProductDetailPage />} />
|
<Route path="/duft/:perfumeSlug" element={<ProductDetailPage />} />
|
||||||
|
|||||||
14
parfum-shop/src/components/ScrollToTop.jsx
Normal file
14
parfum-shop/src/components/ScrollToTop.jsx
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
import { useEffect } from "react";
|
||||||
|
import { useLocation } from "react-router";
|
||||||
|
|
||||||
|
function ScrollToTop() {
|
||||||
|
const { pathname } = useLocation();
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
window.scrollTo(0, 0);
|
||||||
|
}, [pathname]);
|
||||||
|
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ScrollToTop;
|
||||||
Loading…
x
Reference in New Issue
Block a user