In a React Single Page Application (SPA), users often expect the view to scroll to the top when they navigate to a new page. Without this functionality, users might find themselves starting at an arbitrary scroll position, which can be confusing and lead to a poor user experience. The @ganeshdole/scrolltotop
package provides a simple solution to this problem by automatically scrolling the window to the top whenever a new page is loaded using React Router.
- Automatically scrolls the window to the top when a new page is loaded.
- Compatible with React Router.
To install the package, use npm:
npm install @ganeshdole/scrolltotop
- Import the
ScrollToTop
component from@ganeshdole/scrolltotop
. - Wrap the
ScrollToTop
component around the content of your application. - Ensure React Router is set up in your project if you're using it.
Example:
import ReactDOM from "react-dom/client";
import App from "./App.tsx";
import "./index.css";
import { BrowserRouter } from "react-router-dom";
import ScrollToTop from "@ganeshdole/scrolltotop";
ReactDOM.createRoot(document.getElementById("root")!).render(
<BrowserRouter>
<ScrollToTop>
<App />
</ScrollToTop>
</BrowserRouter>
);
This project is licensed under the MIT License - see the LICENSE file for details.