CODEWITHSUNDEEP
javascriptvue.jsvue-clivue-cli-3
Anton
Anton

Reputation: 473

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

I have a json file with this structure:

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

I import it:

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

And then try to use as src for my image:

<img :src='item.address'>

But image doesn't appear. Could anybody say how to solve this problem?

Upvotes: 0

Views: 1278

Answers (1)

MJ_Wales
MJ_Wales

Reputation: 893

You can solve this by changing your json file and image element:

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

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

See more here: https://github.com/vuejs/Discussion/issues/202

Upvotes: 1

Related Questions