Img src in Storage link using v-for not working in Laravel vuejs

Question

I created the image directory using php artisan storage:link but when I tried calling the image src inside the v-for it doesn't display anything at all.

When I tried the static URL, it works-

<img width="300px" v-else src="{{ url('storage/images/validations/20221013192153-cvd-card-image-160310009-0155-00161.png') }}" alt="Red dot"  />

But when I tried this in a for loop, it was not working.

<div class="custom"  v-for="(emv, index) in emvdetailsdata" :key="emv.evd_id">
 <img width="300px" v-else src="{{ url('storage/images/validations/emv.card_image') }}" alt="Red dot"  />
</div>

I also tried, :src, but nothing worked.

Any help would be great.

I dont get it, are you trying to validate the image path from vue? and of course the first example will work because you are going to a direct path. But the 2nd example is doing what exactly? — RG Servers
– RG Servers, Commented Dec 28, 2022 at 7:08
@KGG Im trying to call the response data from the database which is called by v-for and inside v-for I have emv.card_image which is the name of the image file I tried but it doesn't view the image — marivic valdehueza
– marivic valdehueza, Commented Dec 28, 2022 at 7:10

RG Servers · Accepted Answer · 2022-12-28 07:21:57Z

1

You can simply pass the variable like this:

 <img :src="'/storage/images/validations/'+emv.card_image" />

answered Dec 28, 2022 at 7:21

RG Servers

1,7952 gold badges15 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Img src in Storage link using v-for not working in Laravel vuejs

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related