router-link with vue and vuetify confusion

vue-router vuetify.js
TheBAST picture TheBAST · Dec 1, 2017 · Viewed 37.3k times · Source

How to use vue-router with using that predefined template:

https://vuetifyjs.com/examples/layouts/google-contacts

I have added a link in my items object

 items: 
[{ icon: 'dashboard' text: 'Home', link: '/'},

{ icon: 'dashboard' text: 'Account', link: '/account'},

I am confused where to put the router-link component.

Answer

Kael Watts-Deuchar picture Kael Watts-Deuchar · Dec 2, 2017

v-list-tile, v-btn, and v-card all extend router-link, so you can use any of the router-link attributes directly on those components instead.

In your case you can just use <v-list-tile :to="item.link">

Related questions

Open link in new window with Vuetify v-btn and Vue router

Recent versions of Vue Router allow for links that open in a new tab, e.g. the following <router-link :to="{ name: 'fooRoute'}" target="_blank"> Link Text </router-link> correctly renders an <a target="_blank">. However, …

Read More
Vue.js redirection to another page

I'd like to make a redirection in Vue.js similar to the vanilla javascript window.location.href = 'some_url' How could I achieve this in Vue.js?

Read More
How can I get query parameters from a URL in Vue.js?

How can I fetch query parameters in Vue.js? E.g. http://somesite.com?test=yay. Can’t find a way to fetch or do I need to use pure JS or some library for this?

Read More