how to switch a particular component in home page from another page in react-CodePudding

I have 3 pages: "Home", "About us", and "Contact", but have 2 sections like "testimonial" and "faq" which are home page components. Now I can move to those sections from home page but I am unable to move when I am in other page. How to achieve this?

I am trying in this way to move or to scroll these testimonial and faq section;

Nav.js

<Nav.Link className='navoption'>
  <Link to='#testimonials' smooth>
    Testimonals
  </Link>
</Nav.Link>

<Nav.Link className='navoption'>
  <Link to='#faq' smooth>
    Faq
  </Link>
</Nav.Link>

Home.js

<div id='testimonials'>
  <div className="container" data-aos="fade-up">
    <h3 className="alumni1" style={{ marginTop: '100px' }}>Testimonials</h3>
    <hr
      className="mx-auto"
      style={{
        border: '2px solid red',
        marginBottom: '30px',
        width: '50px'
      }}
    />
    <p
      style={{
        fontSize: '20px',
        fontWeight: '400',
        textAlign: 'center',
        marginBottom: '65px'
      }}
    >
      Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem. Sit sint consectetur velit. Quisquam quos quisquam cupiditate. Et nemo qui impedit suscipit alias ea.
    </p>
    <div className="row">

Thanks in advance....

CodePudding user response：

i think it works, give this code a try-

<Link to={{pathname:"/home",hash:"testimonials"}}> Testimonials</Link>

Hope this code will help you, if you still facing just lemme know, I will help you more. Thanks