2

I have a button that goes to a different page with this is the line of code. I'm using Link from react-router-dom:

<Link to="/finefi" className="btn btn-big btn-primary p2">Ingresa a FinEfi</Link>

If I go to /finefi typing the URL it goes to the top of the viewport, but if I click on the button, it goes to the middle of the viewport. How can I fix this behavior?

Also, I have a button in the same page, (in the middle of the page)

<Link to="/finefi" className="btn btn-big btn-primary p2 px3">Regístrese</Link>

and when I click that button I want it to go to the beginning of the same page? How can I do this in both cases?

Lizz Parody
  • 1,705
  • 11
  • 29
  • 48
  • 1
    Possible duplicate of [react-router scroll to top on every transition](https://stackoverflow.com/questions/36904185/react-router-scroll-to-top-on-every-transition) – dave Apr 03 '18 at 19:16
  • what version of react-router are you using ? – Hamza Baig Apr 03 '18 at 19:29

1 Answers1

2

React router only changes the window URL but it doesn't update the document scroll. You need to set it up when you change the page programmatically like:

window.scrollTo(0, 0);

You may need to add something like a listener to window URL changes, to set the scroll to the very top.

Romel Pérez
  • 759
  • 1
  • 6
  • 19