javascript - dynamic path NavLink React - Stack Overflow

admin管理员组

文章数量:1425663

I'm looking for a way to make the "to" property of NavLink react dynamic.

let url = 'localhost'=='localhost'? 'foo':'';
<Router>
 <NavLink to={url+'/'}>Home</NavLink>
</Router>

Work but with each new render react it adds a new url to the existing one. http://localhost/foo After render http://localhost/foo/foo ...

thanks

I'm looking for a way to make the "to" property of NavLink react dynamic.

let url = 'localhost'=='localhost'? 'foo':'';
<Router>
 <NavLink to={url+'/'}>Home</NavLink>
</Router>

Work but with each new render react it adds a new url to the existing one. http://localhost/foo After render http://localhost/foo/foo ...

thanks

• javascript
• reactjs
• react-router
• router
• react-router-dom

Share Improve this question Follow asked Sep 3, 2018 at 11:31 gyorgio88gyorgio88 51711 gold badge55 silver badges88 bronze badges 1

• Not related to your question but if you dont plan to change the value of the url in your code you should use const and not let. – Cata John Commented Sep 3, 2018 at 11:50

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

Try putting a slash in FRONT of the URL, too...

<NavLink to={'/'+url+'/'}>Home</NavLink>

Having no URL in front means "relative to the current path", while a URL in front means "relative to the domain name"

Or maybe a better way to acheive the same result in your case would be to put the slash in front of foo - eg:

let url = 'localhost'=='localhost'? '/foo':''; // <=== added slash 
<Router>
 <NavLink to={url+'/'}>Home</NavLink>
</Router>

本文标签： javascriptdynamic path NavLink ReactStack Overflow