This content originally appeared on DEV Community and was authored by hrb11182
Here we are going to have a look that how we can make links to navigate the different pages of the same website.
In order to do that we need to install two packages react-router-dom and react-router-hash-link.
yarn add react-router-dom react-router-hash-link
Here we have About, Our products, Services so will create a link to the services section.
Move to your App.js.
Line 6 imported Browser Router.
Line 10 to 30 wrapped every thing inside Browser Router.
Now move to Services.js.
Line 2 Provided an ID service.
Move to your App.js.
Line 7 imported Hashlink as link.
Line 18 to 20 created a hash link to the section with ID - service
Now move to browser.
Got a link services once you click it will take you to services page.
If you click it will suddenly take you to that section now we make some changes to make the scroll smooth.
Line 18 added keyword smooth.
This content originally appeared on DEV Community and was authored by hrb11182
hrb11182 | Sciencx (2022-06-23T15:22:58+00:00) In-Page Navigation Tutorial in React. Retrieved from https://www.scien.cx/2022/06/23/in-page-navigation-tutorial-in-react/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.