Vuepress: Allow NavLinks to open in the same window (applies to default theme)

[bryanvaz]

Feature request

Similar to #186, the nav links in the the default theme should also allow devs to define if a link should open in a new tab or the same tab.

What problem does this feature solve?

If there are .html files in the public directory, or external sites we want to link to (one of our links says "Back to "), but not open in a new window, we should at least have the option to override the target=_blank.

What does the proposed API look like?

Same as before

How should this be implemented in your opinion?

So essentially, the theme config would look like this if we wanted an external link to open in the same tab:

themeConfig: {
    nav: [
      { text: 'Home', link: '/' },
      {
        text: 'Partners',
        items: [
          { text: 'Site 1 that opens in a new tab', link: 'https://site1.com' },
          { text: 'Site 2 opens in same tab', link: 'https://site2.com', target: null }
        ]
      }
    ]
  }

with the same logic as #186 applied to the NavLink component

Are you willing to work on this yourself?**

Sure

[ulivz]

Try:

module.exports = {
   markdown: {
      externalLinks: {
          target: '_self',
          rel: ''
      }
   }
}

[bryanvaz]

@ulivz thanks, but I'm talking about the NavLink component in the default theme's header:

https://github.com/vuejs/vuepress/blob/e23174450424766630ac7f2ac3ca030fc60b06be/packages/%40vuepress/theme-default/components/NavLink.vue#L8-L14

The suggestion you provided only affects page content written in markdown.

The change should probably be along the lines of:

 <a 
   v-else 
   :href="link" 
   class="nav-link external" 
   :target="resolveTarget(link)" 
   :rel="isMailto(link) || isTel(link) ? null : 'noopener noreferrer'" 
 >

...

resolveTarget(link) {
  if (link.target) return link.target;
  if (isMailto(link) || isTel(link)) return null;
  return '_blank'; 
}

Can you re-open the issue and I can create a PR against it?

[burasuk]

I would also use it

[yangwao]

I ran in this issue as well. I can drop $5 for this in Eth