如何在 vuetify 中设置轮播图像的大小

Question

在我的 Laravel 5.6/"vue": "^2.5.7/"vuetify": "^1.0.8" 应用程序中，我使用图像轮播（https://vuetifyjs.com/en/components/carousels#introduction）

它可以工作，但如果上传了不同大小的图像，图像会被部分剪切并且视图被破坏。我试着做：

            <v-carousel>
                <v-carousel-item v-for="(nextArtistImage,i) in artistImagesList" :src="nextArtistImage.image_url" :key="nextArtistImage.id"
                                 :alt="nextArtistImage.image_url" style="width: 200px;height:auto;">
                    <div class="carousel_image_title">{{ nl2br(concatStr(nextArtistImage.description, 100)) }}</div>
                </v-carousel-item>
            </v-carousel>

但是我改变风格的尝试并没有改变任何东西......

如果有有效的方法？

谢谢！

Answer 1

尝试...

       <v-carousel>
                <v-carousel-item v-for="(nextArtistImage,i) in artistImagesList" :key="nextArtistImage.id">
<img :src="nextArtistImage.image_url" style="width:200px;height:auto;" :alt="nextArtistImage.image_url"/>
                </v-carousel-item>
            </v-carousel>

上面的 html 利用了 v-carousel-item 的默认插槽。