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

使用模板文字来src动态构造，然后使用v-bind:src来绑定src属性：

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