javascript - Vuetify 中的滚动列表

Question

这是我使用列表的 Vuetify 代码:

<v-list>
    <v-list-tile
            v-for="user in users"
            :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>
</v-list>

问题是，我有超过 100 个用户，并且默认情况下列表不可滚动。有什么特质可以帮助它吗？

Answer 1

我通过提供 max-height: 100px 的样式实现了这一点并添加 vuetify 类 overflow-y-auto至 <v-list></v-list>

例如:

<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>