Next.js link doesn't render with page scrolled at the top

I have a component like so:

const Milestone = props => {
  const { path, disabled, index, ...rest } = props;

  if (disabled) return <MilestoneCheck disabled />;

  return (
    <Link href={path} passHref>
      <a>
        <MilestoneCheck {...rest} />
      </a>
    </Link>
  );
};

when I click on the ‘Link’ to go to the next page and than click the back button to go back to where I came from, the page doesn’t load at the top but from the last scrolled position.
Adding a ‘scrollTop’ method on route change would feel not very efficient, is there a more elegant solution to always having the page loading at the top?

17 thoughts on “Next.js link doesn't render with page scrolled at the top”

Leave a Comment