Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

255
Visualizações
'Open in new tab' click on link not open href value

I am using Vue2 and I have <a> tag with href='#' and @click.prevent="someMethod()".
This is working as expected in a situation when do a left click (it is calling a method), but if I do a right click -> open in new tab, in that case it is opening href value, which is wrong.

Which approach do you suggest in order to also call a @click.prevent="someMethod()" when opening from non-left click situations?

about 4 years ago · Juan Pablo Isaza
3 Respostas
Responde à pergunta

0

If you're looking to control the behavior for all clicks, then you'll need to add more than one click event handler.

Something like this. Here's a working JSFiddle of the code.

  <a
    href="#"
    @click.prevent="someMethod()"
    @auxclick.prevent="someMethod()"
    @contextmenu.prevent
  >
    Click Me
  </a>
</div>

@click.prevent handles left click events.

@auxclick.prevent handles auxclick events (i.e. non-left click events).

@contextmenu.prevent disables the context menu that pops up when you right click on the element.

about 4 years ago · Juan Pablo Isaza Relatório

0

I have keeped anchor link with @click.prevent + added :href='sameMethodAsInClickEvent()' so now, if it will be non-left-click, it will call href and still it will open the right link/method.

about 4 years ago · Juan Pablo Isaza Relatório

0

You cannot override the native context menu Open in New Tab behavior; it will always open the anchor's href in a new tab.

Your only options are:

  • Prevent the context menu from being shown with @contextmenu.prevent. Not good UX.
  • Prevent the context menu but instead show your own custom context menu with an Open in New Tab item which you can handle yourself.
  • Use a <button>. This was my first thought since you don't really need an anchor here anyway because there's no real link.
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda