nuxtjs vuetify v-img占位符不起作用

Question

在nuxt.js下，我使用的是vuetify。v-img是有效的，但当我尝试使用文档中描述的"占位符"功能时，它不起作用。对于这个例子，我完全复制了文档中的例子。我们假设在等待图像时看到一个圆形加载器。为了测试，我使用chrome来降低连接速度。这行不通。有几秒钟的空白，然后图像出现。这是代码。知道吗？

<v-col cols="4">
<v-img :src="selectedItem.picture">
<template v-slot:placeholder>
<v-row class="fill-height ma-0" align="center" justify="center">
<v-progress-circular indeterminate color="blue"></v-progress-circular>
</v-row>
</template>
</v-img>
</v-col>

注意：我没有使用vuetify加载程序。这会是问题所在吗？

Answer 1

最好使用"默认"插槽，并在检查图像的@error="imgLoadStatus='error'"时显示它。对我来说，有时在运行时动态加载和更改图像时，占位符根本不会出现。