0

I have two pages ad on clicking the button in page-1, I want to get redirected to a specific section in page-2. I'm trying to use useRef hook for this purpose, but not getting it working properly. My page-1 looks like the following:

import {useRef} from 'react';
function Appeal_page() {
  const donorsRef = useRef(null);
  const dataToSend = {
    donorsRef: donorsRef.current
  }
  return (
    <div>
      <Link to={{ pathname: `/appeal/${appeal.id}`, state: dataToSend }}>
        <button>Donors List</button>
      </Link>
    </div>
  );
}

export default Appeal_page;

And here is the code for page-2:

function Appeal_about(props) {
  const { donorsRef } = props.location.state
  return (
    <div className="donors-list" ref={donorsRef}>
      <ul>
        <li>Donor 1</li>
        <li>Donor 2</li>
        <li>Donor 3</li>
      </ul>
    </div>
  );
}

export default Appeal_about;
Drew Reese
  • 165,259
  • 14
  • 153
  • 181
Fuaad
  • 197
  • 15
  • just use `#` in the url and `id` for destination section: https://www.w3docs.com/snippets/html/how-to-create-an-anchor-link-to-jump-to-a-specific-part-of-a-page.html – pedram afra Apr 29 '23 at 12:54

0 Answers0