[Vuejs]-How to use router-link "to" prop on vuetify components?

by

1👍

✅

v-avatar isn’t a link abd doesn’t support to so you have to wrap your image with a router link like:

<div id="app">
  <v-app>
    <v-app-bar>
      <v-toolbar-items>
        <router-link to="/profile">
          <v-avatar>
            <v-img src="http://www.dumpaday.com/wp-content/uploads/2019/10/00-156-750x280.jpg"></v-img>
          </v-avatar>
        </router-link>
      </v-toolbar-items>
    </v-app-bar>
  </v-app>
</div>

Or you add a custom click event on the v-avatar and do the routing in a method like

<v-avatar @click="forward">

JS

methods: {
  forward() {
     this.$router.push("/profile")
  }
}
👤dreijntjens

Leave a comment