Search code examples
laravelvue.js

How to view an image using Vue JS


I want to view an image but it is not displaying, only alt text is displayed. I have inserted the image successfully and have saved the image inside the public folder. I have created folder images inside the folder that I want to save the image in. This is what I tried:

Form image:

<td>
    <img :src="getImageUrl(product.photo)" alt="Product Image" width="100">
</td>

js

getImageUrl(photo) {
    return photo ? `/images/${photo}` : '/images/default.jpg';
},

Solution

  • Where is your photo located? It must be located into public folder. Then you can use like that. Please try once then if you have more problems, don't hesitate to ask me.