Image path in Vue JS [duplicate]

Question

I have structure file in vue js like this:

--assets
----image
------my-image.png
------my-image2.png

--components
----user
------userStart.vue

I will show the image using object in array here is my code (userStart.vue)

<img v-for="image in images" :src="image.url"/>

export default{
  data(){
    return {
      images : [
         {
            url : '../../assets/image/my-image.png',
            name : 'My Image 1',
         },
         {
            url : '../../assets/image/my-image1.png',
            name : 'My Image 2'
         }
      ]
    }
  }
}

The problem is I cannot show the image, how to fix it? Thank you

Answer 1

You can use require()

For example:

<img v-for="image in images" :src="require(image.url)">