in React router dom can i pass a props in a Link?
Is there a way that i can pass props into Link then just the component?
I'm trying to pass props inside a Link like this.
function App(){
const test = "Hello"
return(
<Link to="/detail" test={test}> detail </Link>
)
}
In my detail component i can call like this.
function detail(){
return(
<p>{test}</p>
)
}
I'm sorry if this example is very hard to understand, I don't know how to give proper example.
CodePudding user response:
Using state
prop you can as - Docs ref V5
function App(){
const test = "Hello"
return(
<Link to= {{ pathname : "/detail", state: { test: "dummy"} }}> detail </Link>
)
}
and get the value using useLocation
hook
In my detail component I can call like this.
function detail(){
const {state} = useLocation();
return(
<p>{state.test}</p>
)
}