Question

我有以下代码：

    <NavLink to="//student.lvh.me:8080/users/edit">
      <DropDownLink>Wiki</DropDownLink>
    </NavLink>

如何让navlink与外部网址一起使用？我在控制台中收到以下错误：

Uncaught DOMException: Failed to execute 'pushState' on 'History': A history state object with URL 'http://student.lvh.me:8080/users/edit' cannot be created in a document with origin 'http://localhost:3000' and URL 'http://localhost:3000/'.

有更好的方法来处理外部链接吗？

Answer 1

react-router意味着＆＃34;路线＆＃34;在单页应用程序中。当您想要路由到不在单个页面上路由的外部页面时只需使用普通的锚标签？ <a href="url.com">Wiki</a>

Answer 2

<NavLink> 非常容易用于导航到外部 url。试试这个：

<NavLink to={{pathname="https://infortts.com"}} target="_blank">
  Some Component Here
</NavLink>

Answer 3

由于 NavLink 使用路由器，外部 url 应该通过“as”

 <NavLink as="a" href="https://student.lvh.me:8080/users/edit" target="_blank" >
    <DropDownLink>Wiki</DropDownLink>
 </NavLink>

或不使用 React 路由器

<a href="url.com">Wiki</a>

将NavLink与外部URL一起使用

3 个答案: