0
119
Views¿Porque la propiedad photos.name vuelve a mí como si lo estuviera haciendo mal?
Tengo un error con vue.js y laravel, pero no puedo entender cómo puedo codificar esta matriz/objeto en el interior. la llamada api es así :
Me gustaría simplemente obtener el name de las fotos internas y luego traerlo a la interfaz, pero cada vez que lo hago me dice indefinido como si estuviera haciendo un método de entrada incorrecto.
Interfaz de código :
<div class="col-md-3" v-for="(room, index) in rooms" :key="index"> <div class="card mb-3 border-0"> **<img :src="'/img/rooms/'+room.photos.name" class="card-img-top br0" :alt="room.photos.name">** <p class="small text-uppercase pb-0">{{ room.listing_name }}</p> <div class="card-body p-0"> <h5 class="card-title">{{ room.listing_name }}</h5> <p class="card-text m-0">${{ room.price }}/night</p> <p class="small m-0 text-info">★★★★★ <span class="text-secondary"> {{ index }}, Superhost</span></p> </div> </div> </div> 
·
Juan Pablo Isaza
3 answers
Answer question0
photos es una matriz:
<img :src="'/img/rooms/'+room.photos[0].name" class="card-img-top br0" :alt="room.photos[0].name">O puedes iterar:
<img v-for="photo in room.photos" :src="'/img/rooms/'+photo.name" class="card-img-top br0" :alt="photo.name">
·
Juan Pablo Isaza
Report
0
photos es una matriz de objetos. Por lo tanto, se debe acceder a los Elementos a través de index.
Debe agregar una iteración más para las fotos a través v-for .
<img v-for="photo in room.photos" :key="photo.id" :src="`/img/rooms/${photo.name}`" class="card-img-top br0" :alt="photo.name" />
·
Juan Pablo Isaza
Report
0
La etiqueta de la imagen debe ser algo como esto:
<img src="/img/rooms/{{room.photos.name}}" alt="">
·
Juan Pablo Isaza
Report
Answer question