无法使用 VueJS 渲染图像

Question

我正在尝试使用 VueJS 用照片填充我的 index.html。我正在使用 iTunes API，返回链接正在返回图像的 URL。

我的问题是，我无法渲染照片。 item 是一个对象。

我已经尝试过这样做。但是，它会导致整个网页不显示（全白）。所以，这是完全错误的。最初， v-bind:src= 指向我文件夹中的图像。但我正在尝试动态获取 URL。

<div class="col-sm-4" style='max-width:200px;margin-right: 30px'>
    <img style='width: 120%; display: inline; ' v-bind:src="{{ item.artworkUrl100 }}">
</div>

当我这样做时，我实际上可以在我的网页上看到其余的数据。但是，图像没有显示出来。

<div class="col-sm-4" style='max-width:200px;margin-right: 30px'>
     {{ item.artworkUrl100 }}
</div>

我不确定如何使用 VueJS 语法将图像动态嵌入到我的网站中。

Answer 1

删除{{ }}

<img style='width: 120%; display: inline; ' v-bind:src="item.artworkUrl100">