I am using React router with Link to change urls and navigate trough app. In list of readings I navigate user to reading edit with this code:

 <Link to={`readings/edit/${reading.id}`} params={{id: reading.id}}>

I have defined the following routes:

<Route path="/" ponent={App}>
        <IndexRoute ponent={Greetings}/>
        ...
        <Route path="readings/edit/:id" ponent={requireAuth(ReadingEdit)}/>
        <Route path="readings/:tab" ponent={requireAuth(ReadingListContainer)}/>
        ...
    </Route>

The navigation works as it should, but the URL is wrong it should be http://localhost:8000/readings/edit/5 but instead it is http://localhost:8000/readings/readings/edit/5. This means that when I refresh site the router does not find a path.

How can I sole that problem?

I am using React router with Link to change urls and navigate trough app. In list of readings I navigate user to reading edit with this code:

 <Link to={`readings/edit/${reading.id}`} params={{id: reading.id}}>

I have defined the following routes:

<Route path="/" ponent={App}>
        <IndexRoute ponent={Greetings}/>
        ...
        <Route path="readings/edit/:id" ponent={requireAuth(ReadingEdit)}/>
        <Route path="readings/:tab" ponent={requireAuth(ReadingListContainer)}/>
        ...
    </Route>

The navigation works as it should, but the URL is wrong it should be http://localhost:8000/readings/edit/5 but instead it is http://localhost:8000/readings/readings/edit/5. This means that when I refresh site the router does not find a path.

How can I sole that problem?

• javascript
• reactjs
• url
• react-router

• 4 Have you tried adding a / before readings in your Link tag? – Tahnik Mustasin Commented Jan 12, 2017 at 11:31
• 1 ohh man, that is the solution. Big thanks, and I was speding like 2 hours to figure that one out... But why does Link do that??? – alphiii Commented Jan 12, 2017 at 11:42
• 1 Link probably uses / as the root path and adds the rest of it to the root. If you don't use / the it is using the current URL in your browser as root. So my guess is the URL you are routing from is "localhost:8000/readings" – Tahnik Mustasin Commented Jan 12, 2017 at 11:48
• 1 Also, please mark my answer as the current one. Otherwise your post will stay as unsolved. – Tahnik Mustasin Commented Jan 12, 2017 at 11:49

1 Answer 1

As discussed in the ment, adding a / before readings in your Link tag will fix the issue.