Vuejs：使用 v-for 显示资产中的图像数组

Question

我的资产文件夹中有 100 张名为 1.png 到 100.png 的图像。我想使用 v-for 显示它们，但我不想为它们每个 url 硬编码。

<div v-for="n in 100">
    <img src="../assets/photos/(1.png, 2.png...).png">
</div>

我应该为 (1.png, 2.png...) 做什么？我应该将它们放入数据中吗？

Answer 1

使用template literals to construct the src dynamically and then use v-bind:src绑定src属性：

<div v-for="n in 100">
    <img v-bind:src="`../assets/photos/${n}.png`">
</div>

Vuejs: Use v-for to display an array of images from assets