How to send data with Link tag in React

Question

import { Link } from "react-router-dom";
import All_Song from "../Resources/Songs";
//Array of objects

function AllSong() {
  console.log(All_Song);
  return (
    <div>
      {All_Song.map(song=>{
        return(
          <Link key={song.image} to="/" details={song}>
            <div>{song.song}</div>
          </Link>
        );
      })}
      <Link to="/">
        Back
      </Link>
    </div>
  );
}

export default AllSong;

I want to send the song Object every time the Link gets clicked, I tried using details as a prop but it didn't worked. I also referred to the following link but it also didn't helped. How to send data via LINK in react js?

Can someone give a solution to this?

Thank You in advance