1

I have a super weird problem here, I want to use a for-loop (using v-for) for images inside /static.

Strangely, using v-img only works if it's used in conjunction with img. I'd like to strictly use v-img for easy formatting and continuance.

Here is my code(s) and a screenshot for each example:

Just using v-img

<div v-for="(image, index) in images" :key="index"> <v-img :src="image.src"></v-img> </div> 

Nothing is displayed. enter image description here

Just using img

<div v-for="(image, index) in images" :key="index"> <img class="image" :src="image.src" :alt="image.alt"> </div> 

Images are displayed with standard img properties. enter image description here

Using both v-img and img

<div v-for="(image, index) in images" :key="index"> <v-img :src="image.src"></v-img> <img class="image" :src="image.src" :alt="image.alt"> </div> 

Images are displayed from both v-img and img. enter image description here

3
  • Where is images coming from? Commented Jul 17, 2019 at 0:51
  • @Josef7 the images object in data Commented Jul 17, 2019 at 15:39
  • Can you provide the whole code for the component? I don't have the same problem with the snippet you provided. Commented Jul 19, 2019 at 1:13

2 Answers 2

1

I have given an example on codepen

https://codepen.io/anon/pen/zVmMYK

<v-img v-for="image in images" :src="image.src" aspect-ratio="2"/> 

this works for me

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

Comments

0

You can try this <v-img :src="require('image.src')"></v-img> I hope it helps.

1 Comment

I got Cannot find module 'image.src' (NuxtServerError)

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.