To add an external link with React Router, we can set the to prop to an object with the pathname property set to the external URL we go to when the link is clicked.
For instance, we write
<Link to={{ pathname: "https://example.com" }} target="_blank" />
to set the to prop to { pathname: "https://example.com" } to go to https://example.com when we click on the link.
Also, we set target to _blank so that the link opens a new tab when we click it.
3 replies on “How to add an external link with React Router?”
I did exactly that- Example
but I get this in return
http://localhost:3000/https://example.com
and this on the console
router.ts:11 No routes matched location “/https://example.com”
I don’t know how to fix that
Better just use a plain a element if Link didn’t work.
I found this this to be a better solution , but not for all cases
import React, { useEffect } from “react”;
export default function Contact() {
useEffect(() => {
window.location.href = “https:example.com”;
}, []);
return (
Contact
);
}