Handling hashes

[tharakabimal]

When you have a <Link /> component that points to a section of the page.

Eaxmple: In my header I have the following 👇

<Link route="/cart">
 <a>Cart</a>
</Link>

<Link route="/cart#wishlist">
 <a>Wish List</a>
</Link>

And in my Cart I have this 👇

componentDidUpdate() {
 // I use  window.location.href to get the hashTag
 if (hashTag === 'wishlist' ) {
   this.scrollToSection();
 }
}

scrollToSection = () => {
 if (!!this.myRef.current) {
  window.scrollTo({
    top: this.myRef.current.offsetTop,
    behavior: 'smooth',
   });
  }
};

render() {
 <>
   <div className="cart ">
      Cart items here.............
   </div>
   <div className="wishlist " ref={this.myRef}>
      Wish list items here.............
   </div>
 </>
}

How do I get the scrollToSection fired when I want to go down to the wishlist section from the cart page? (url/cart 👉 url/cart#whishlist )?