How to pass parameters in react-router-dom Link?

Question

I have links to components-pages, for example:

<Link to="/"> Home <Link/>

In props I have a parameter, for example userId. I need to pass it in Link. I know how to pass params in onCLick():

this.props.router.push({
  pathname: '/',
  state: {
    userId: 7
  }
})

How I understand in ink can be performed onClick, but may be it's possible to pass somehow params in it? Without creating onClick?

score 15 · Accepted Answer · answered Apr 03 '18 at 08:21

15

Yes, you can pass an object to the "to" prop like this.

 <Link to={{
  pathname: '/courses',
  search: '?sort=name',
  hash: '#the-hash',
  state: { fromDashboard: true }
 }}/>

answered Apr 03 '18 at 08:21

Kris

To get the data passed to the `to` object, you need to use the `useLocation` hook on the next screen. `let location = useLocation();` – Adrian Bartyczak Feb 15 '22 at 06:07

1 Answers1