image - 如何通过可视化设置轮播图片的大小

Question

在我的Laravel 5.6/“vue”:“^ 2.5.7/” vuetify“:” ^ 1.0.8“应用程序中，我使用的轮播
图片(https://vuetifyjs.com/en/components/carousels#introduction)

它可以正常工作，但是如果上传了不同尺寸的图像，则图像会被部分剪切并且 View 被破坏。
我试图使像:

            <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的默认广告位。