Nuxt: How to open page in a new tab

Question

I go through the documentation of Nuxt, but couldn't find information about how to open a page in a new tab. Is there a way to open a link in a new tab instead of opening it in the current tab? I tried the following code:

<nuxt-link to="/user" target="_blank">User</nuxt-link>

But it doesn't work.

Iinde

Adding attribute target="_blank" now works – Pellegrino

Answer 1

The whole point of vue-router is navigating inside a single page application so it doesn't have a way to navigate to a blank new tab as far as I know. Fortunately there is an old fashioned thing called 'html' which has something called an anchor tag that you can use like this:

<a href="/user" target="_blank">User</a>

Saskatoon

Love your cynicism – Harkey

Nuxt 3 Nuxt-link adds the rel=”noreferrer noopener” to external links, so it is advised to use NuxtLink for external links as well, if you're using Nuxt 3 – Orifice

Answer 2

As @anthonygore pointed out in a comment to first post. It's now working to open link in a new tab by , having all the features of router name/path link

do it with by adding target="_blank" to/inside NuxtLink to have

<NuxtLink :to="..." target="_blank">Nuxt link to external page</NuxtLink>

or just use default

<a href="..." target="_blank">A link to external page</a>

Distracted

I think the closing tag in the upper example should be </NuxtLink> instead of </a> – Lent

Answer 3

<a href="./user" target="_blank">User</a>

Note that the path should start with dot. If the website is not at root.

Bazaar