How to link a Vuetify <v-card> to an external website?

user_931247 0
Viewed 1332

How to link a v-card to an external website ?

When I'm doing this:

<v-card to="https://www.stackoverflow.com">
  <v-card-title>STACK OVERFLOW</v-card-title>
</v-card>

It's redirecting to:

http://localhost:3000/https://www.stackoverflow.com
nuxtjs vue-router vuetify.js vue.js
2 Answers

to prop is used to redirect to vue router path, if you want to redirect to an external link you could use href instead with target="_blank" if you want to open the link in new tab :

 <v-card href="https://www.stackoverflow.com" target="_blank">
user_81728570

You're using the wrong attribute, you should be using the href attribute like this which will denote the element as an anchor (a) tag:

<v-card href="https://www.stackoverflow.com">
  <v-card-title>STACK OVERFLOW</v-card-title>
</v-card>
user_48267400
Related