How to navigate to an external URL?

Question

I'm creating a simple App in React , using React Router v4, with this structure

-Wrapper
 -Home /
 -Homepage /h
    --GalleryContainer  /h/gallery
       ---Gallery  /h/gallery
       ---Item    /h/gallery/:itemId
    --About /h/about
    --Links /h/links

in Links, there is a list of elements that redirects to external links. Problem is, when you click on url www.example.com, it goes to http://localhost:7770/h/www.example.com and render 404 link not found

Here is the code

<div className="links">
        <ul>
          {link.links.map((url,i)=>
            <li key={i}><a href={url}>{url}</a></li>)}
        </ul>
      </div>

with url being www.example.com or any weblink.

How do you make url goes to www.example.com and not http://localhost:7770/h/www.example.com?

Answer 1

You should add http:// to the beginning of your url. So your code should be

<li key={i}><a href={"http://"+url}>{url}</a></li>