Vue-cli：如何使用来自本地 json 的图片路径作为 src

Question

我有一个具有这种结构的 json 文件：

[
  {
    "id": 1,
    "name": "name1",
    "address": "require(./assets/pic1.jpg)"
  }
]

我导入了：

import data from "./assets/test.json"

然后尝试将其用作我的图片的 src:

<img :src='item.address'>

但是图像没有出现。谁能告诉我如何解决这个问题？

Answer 1

您可以通过更改 json 文件和图像元素来解决此问题：

[
  {
    "id": 1,
    "name": "name1",
    "address": 'pic1.jpg'
  }
]

<img :src="require(`./assets/${item.address}`)" >

Vue-cli: how to use pictures' paths from local json as src