React链接添加不需要的/ (React JS)
React链接添加不需要的/ (React JS)
提问于 2018-08-01 02:55:26
我想在我的项目中添加一个Bootstrap选项卡。但是，当从react-router-dom而不是a使用Link时，它会导致问题。
<a href="#myID">DEMO</a>
<Link to="#myID">DEMO</Link>在Chrome的控制台中，我发现在ID前面添加了一个"/“，这使得选项卡无法工作(我在控制台中通过”编辑属性“手动删除了"/”，它可以工作)，我想知道我如何解决这个问题？
(在控制台中)
Link: href="/#myID"
a: href="#myID"Bootstrap 4选项卡：https://www.w3schools.com/bootstrap4/bootstrap_ref_js_tab.asp
谢谢大家，
肯尼
回答 1
Stack Overflow用户
发布于 2018-08-01 03:23:51
react-router的Link组件设计用于处理相对链接，因此他们必须插入这些斜杠才能组成有效的网址。
要解决此问题，您需要使用绝对路径：
更新使用路由器属性比使用全局变量更好：
// props from `react-router`'s Route
const Component = ({ location }) => (
// render stuff
<Link to={location.pathname + '#myID'}>DEMO</Link>
// render stuff
)
// assuming routes similar to
// ...
<Route path="somepath" component={Componet} />
// ...使用全局变量document的初始答案代码
<Link to={document.location.pathname + '#myID'} />
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51620247
复制相关文章
相似问题