using NavLink with external URL

Question

I have the following code:

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

how do I get navlink to work with external URLs? I get the following error in console:

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/'.

is there a better way to handle external links?

Answer 1

react-router meant to route in a Single Page Applications, i.e route is handled on the client side.
When you want to route to an external page e.g route is handled on the server side, you can use a normal anchor tag:

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

Answer 2

<NavLink> is very easy to use for navigating to external url. Try this:

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