动态路径 NavLink React

【问题标题】：dynamic path NavLink React动态路径 NavLink React
【发布时间】：2018-09-03 11:31:55
【问题描述】：

我正在寻找一种方法来使 NavLink 的“to”属性反应动态。

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

工作，但随着每个新的渲染反应，它会为现有的 URL 添加一个新的 URL。 http://localhost/foo 渲染后 http://localhost/foo/foo ...

谢谢

【问题讨论】：

【解决方案1】：

尝试在 URL 的前面也加一个斜杠...

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

前面没有URL表示“相对于当前路径”，而前面有URL表示“相对于域名”

或者，在您的情况下获得相同结果的更好方法是将斜杠放在 foo 前面 - 例如：

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

【讨论】：