[Vuejs]-Using image props – vue

3👍

You do not need to use {}
juse remove those brackets from your :src binding

<div v-for="(n, i) in images" :key="i">
    <v-img :src="n"></v-img>
</div>

...

images: [
     '../assets/thirdSection/Olivia.png',
     '../assets/thirdSection/Olivia.png',
     '../assets/thirdSection/luiz.png',
]

0👍

Try using require to load your local images:

<div v-for="(n, i) in images" :key="i">
    <v-img :src="require(n)"></v-img>
</div>

...

images: [
     '@/assets/thirdSection/Olivia.png',
     '@/assets/thirdSection/Olivia.png',
     '@/assets/thirdSection/luiz.png',
]

You just have to install file-loader to your modules and configure your webpack.

Doing it like that, your local image path is resolved into a url.

Leave a comment