json - 在 VUE 中显示图像，该图像托管在 https 上

Question

我有一个看起来像这样的 json:

    {
    "books": [
        {
            "name": "Lord of the rings",
            "author": 1,
            "year": 1937,
            "genre": 3,
            "imageUrl": "https://cdn.lifehack.org/wp-content/uploads/2015/03/9780618640157_custom-s6-c30.jpg",
            "availability": true
        }
}

我正在尝试像这样显示图像:问题是图像没有显示，因为 url 是这样的 localhost:8080/https://....我的代码如下所示:

<tr v-for="item in items.books" :key="item.name">
   <td>{{item.name}}</td>
   <td>{{item.author}}</td>
   <td>{{item.genre}}</td>
   <td><img :src="'{{'+item.imageUrl+'}}'"></td>
   <td>{{item.svailability}}</td>
</tr>

有什么想法吗？

Answer 1

正确的方法:<img :src="item.imageUrl">