scrolling list in Vuetify
I achieved this by giving the style of max-height: 100px
and adding vuetify class overflow-y-auto
to <v-list></v-list>
For eg:
<v-list style="max-height: 100px" class="overflow-y-auto"> <template v-for="user in users" > <v-list-tile :key="user.id" avatar @click="" > <v-list-tile-content> <v-list-tile-title v-text="user.name"></v-list-tile-title> </v-list-tile-content> <v-btn icon> <v-icon>edit</v-icon> </v-btn> </v-list-tile> </template> </v-list>
For vuetify 2.0 the helper class 'scroll-y' is changed to 'overflow-y-auto'.https://github.com/vuetifyjs/vuetify/releases (Just Ctrl+F 'scroll-y')So use.
<v-list style="max-height: 100px" class="overflow-y-auto">
For the record, you don't actually need to use a style
attribute at all, you can do it with the overflow-y-auto
class and a max-height
prop:
<v-list class="overflow-y-auto" max-height="400">
Vue 2.6.10, Vuetify 2.0.0