NavLink with externalLink

Question

<NavLink target="_blank" to={{ pathname: "mailto:test@gmail.com" }}>
   <h3>Say hi...</h3>
</NavLink>

<NavLink
          style={{ color: "inherit" }}
          to={{ pathname: "https://github.com/user" }}
          target="_blank"
        >
          <LinkedIn width={30} height={25} fill="currentColor" />
        </NavLink>

Here I am using NavLink to reach a external Link. But when I click on the link it redirects to http://localhost:3000/mailto:test@gmail.com. using a instead of NavLink is working fine.

Is there any way that it can work with NavLink.

Thanks in Advance

Markus · Answer 1 · 2022-05-18T15:56:26.827

-1

Try sth. like this

<NavLink as="a" target="_blank" href="mailto:test@gmail.com">
   <h3>Say hi...</h3>
</NavLink>

edited May 18 '22 at 15:56

answered May 18 '22 at 15:04

Markus

1,909
4
26
54

on using this code, react throws error ```Uncaught TypeError: Cannot read properties of undefined (reading 'pathname')``` – Yash Bajaj May 18 '22 at 15:40
for sure my mistake. updated the answer – Markus May 18 '22 at 15:56

NavLink with externalLink

1 Answers1