how to make auto-scroll after a click in react

25 Views Asked by At

What I need is that after clicking one of the labels in the Header component it scrolls me directly to that component

here is my Home page that contains my main components

function Home() {
  return (
    <React.StrictMode>
      <Header/>
      <Menu/>
      <Holder/>
      <Flyer/>
      <SideBar/>
      <Steps/>
      <Contact/>
    </React.StrictMode>
  );
}

export default Home;

and here is my Header component

const Menu = (props) => {
  return (
    <>
      <div className="Menu-Popup-Container">
        <div className="Menu-Popup">
          <div className="Menu-Block l1-s-menu">
            <label>Contact us</label>
          </div>
          <div className="Menu-Block l1-s-menu">
            <label>Menu</label>
          </div>
          <div>
            <label>Welcome</label>
          </div>

          <div className="Menu-Block l1-s-menu">
            <label>How to buy</label>
          </div>
        </div>
      </div>
    </>
  );
};
export { Menu };

do you know if i could refer external components like siblings?

0

There are 0 best solutions below