CODEWITHSUNDEEP
reactjsreact-routerreact-bootstrap
Farook K
Farook K

Reputation: 96

LinkContainer with a full URL - React-Bootstrap-Router

I'm wondering how I can have my LinkContainer/NavItem link to an external URL. I tried:

<LinkContainer to="https://www.example.com">
 <NavItem eventKey={1}>LinkedIn</NavItem>
</LinkContainer>

In which case I get the error:

A path must be pathname + search + hash only, not a full URL

I've also tried:

<NavItem eventKey={1} href="https://www.example.com"></NavItem>

The above yields no error, but doesn't do anything.

Upvotes: 1

Views: 2883

Answers (2)

antonioduarte
antonioduarte

Reputation: 655

Using the Link from react-router commented by @yussan, you can add a target value and it should work. I'm using it to link external social networks, like this:

import { Link } from 'react-router'

<Link to="https://facebook.com/mypage" target="new">Facebook</Link>

I know its an old thread, but I faced this issue today and wanted to share the solution.

You'll probably be able to do something like this:

<Link to="https://www.example.com" target="new"> <NavItem eventKey={1}>LinkedIn</NavItem> </Link>

Hope it helps,

Upvotes: 2

yussan
yussan

Reputation: 2327

that component is based on react-router Link https://www.npmjs.com/package/react-router , and only used to transition within website.

for example : /people /people/id

if you want create direct link to other website, you have to create own link component with a href.

Upvotes: 1

Related Questions