Si usted está interesado sólo en las trayectorias relativas como: /dashboard
, /about
etc, Ver otras respuestas.
Si desea abrir una ruta absoluta como: https://www.google.com
a una nueva pestaña, debe saber que Vue Router NO está destinado a manejarlos.
Sin embargo, parecen considerar eso como una solicitud de función. # 1280 . Pero hasta que hagan eso,
Aquí hay un pequeño truco que puede hacer para manejar enlaces externos con vue-router.
- Vaya a la configuración del enrutador (probablemente
router.js
) y agregue este código:
Router.prototype.absUrl = function(url, newTab = true) {
const link = document.createElement('a')
link.href = url
link.target = newTab ? '_blank' : ''
if (newTab) link.rel = 'noopener noreferrer'
link.click()
}
Ahora, siempre que tratemos con URL absolutas, tenemos una solución. Por ejemplo, para abrir Google en una nueva pestaña.
this.$router.absUrl('https://www.google.com)
Recuerde que cada vez que abrimos otra página a una nueva pestaña DEBEMOS usar noopener noreferrer
.
Leer más aquí
o aquí