'React router how to go up with link to pathname [duplicate]

I am using the Link component from react router as follows

    <li><Link to={{
      pathname: "../photos",
      state: {
        id: props.id
      }
    }} className="nav-link active" >photos</Link></li>

I am using Link this way because I need to pass in some data to the linked component. The linked component exists on a route one level above the current route, hence the two dots and a slash ../ However, when clicked I'm not taken to a level above the current route, but rather /photos is appended to the end of the current route. If I use Link in this manner

<li><Link to="../photos" className="nav-link active" >photos</Link></li>

then it works as expected, but I am unable to pass data through. I don't understand why there is a discrepancy.

-----------------------EDIT--------------------------

Here is the solution Can not pass state with react router dom v6 beta, state is null

javascripthtmlreactjsurlreact-router


Solution 1:[1]

Use absolute path. For example;

pathname: "/dashboard/users/5/photos"

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Emre A

Related Questions