tengo este componente:
<template> <div id="news" class="news page"> <router-link class="news-card" :to="{ name: 'news-article'}"> <a :href="'https://www.facebook.com'">www.facebook.com</a> </router-link> </div> </template> y quiero que se pueda hacer clic en la etiqueta de anchor para que abra la URL https://www.facebook.com .
Intenté levantarlo en prioridad con z-index pero parece que no funciona:
<style scoped lang="scss"> .news { .news-card { position: relative; z-index: 1; a { position: relative; z-index: 2; &:hover { color: red; } } } } </style> El efecto de desplazamiento sobre el anchor funciona, pero no la propiedad href . ¿Alguna idea de cómo hacerlo?
router-link es básicamente a etiqueta, por lo que básicamente tiene a etiqueta dentro de a etiqueta. Supongo que al hacer clic en www.facebook.com te llevará a { name: 'news-article' } en lugar de a Facebook.
Esto es lo que quieres hacer, supongo..
<template> <div id="news" class="news page"> <router-link class="news-card" to="https://www.facebook.com"> www.facebook.com </router-link> </div> </template>