我继续在我的小型个人项目中使用 vuetify 来很好地研究 vue 和 vuetify,我正在使用 v-col 和 v-img 创建图像库,我想单击每个图像以进入全屏(在style lightbox)但 vuetify 似乎没有这种原生功能,这可能吗?似乎很奇怪没有。有人能给我建议一个解决方案吗?抱歉,也许是个愚蠢的问题,但正如我所说,我是初学者
我附上代码
<template>
<div class="gallery">
<h1 class="subtitle-1 grey--text pa-2 d-flex justify-center">Galleria</h1>
<v-divider></v-divider>
<v-container class="my-5">
<div>
<v-row>
<v-col v-for="item in items" :key="item.id" class="d-flex child-flex" cols="4" >
<v-img :src="item.src" contain class="grey lighten-2">
<template v-slot:placeholder>
<v-row class="fill-height ma-0" align="center" justify="center">
<v-progress-circular indeterminate color="grey lighten-5"></v-progress-circular>
</v-row>
</template>
</v-img>
</v-col>
</v-row>
</div>
</v-container>
</div>
</template>
<script>
// @ is an alias to /src
export default {
name: 'Gallery',
data(){
return {
items: [ …Run Code Online (Sandbox Code Playgroud) 我试图根据我有多少个答案来迭代 v-divider,以便每个答案都有一个分隔符 (4)。从官方文档的一个例子中得到提示,我正在尝试类似的事情,但我无法理解,有人可以向我解释我错在哪里?

这是代码:
<template>
<div class="dark2">
<v-card max-width="600" class="mx-auto">
<v-toolbar extended class="mt-10" color="light-blue" dark>
<v-toolbar-title class="flex text-center">
<h2 class="text-center mt-10">Quiz Dark 2</h2>
</v-toolbar-title>
</v-toolbar>
<v-progress-linear :value="progress"></v-progress-linear>
<v-list subheader two-line v-for="(element, index) in questions.slice(a,b)" :key="index" v-show="quiz">
<h1 class="text-center my-4">Domanda {{ b }}/{{ questions.length }}</h1>
<v-list-item class="d-flex justify-center text-center">{{ element.question }}</v-list-item>
<v-divider class="mt-10"></v-divider>
<v-list-item-group active-class="pink--text">
<v-list-item class="d-flex justify-center my-2" v-for="(item, index) in element.suggestions" :key="index">
{{ item.suggestion }}
</v-list-item>
<v-divider v-if="index < questions.length - 1"
:key="index"></v-divider>
</v-list-item-group>
</v-list>
</v-card>
</div> …Run Code Online (Sandbox Code Playgroud)