0
146
Vistas¿Cómo mostrar una propiedad de un objeto dentro de una matriz en los datos de Vue durante un ciclo definido en la Plantilla?
Mi estructura de datos:
data: { OBJs: [ { "imageUrl": "site/image1.png", "name": "name1" }, { "imageUrl": "site/image2.png", "name": "name2" }, { "imageUrl": "site/image3.png", "name": "name3" }, { "imageUrl": "site/image4.png", "name": "name4" }, ] }Luego en la plantilla
<div v-for="index in OBJs.length" :key="index"> {{OBJs[index].imageUrl}} </div>Pero sigo recibiendo este error.
Si represento solo los OBJ [índice] de esta manera:
<div v-for="index in OBJs.length" :key="index"> {{OBJs[index]}} </div>... ¡Obtengo todos los objetos!
{ "imageUrl": "site/image1.png", "name": "name1" } { "imageUrl": "site/image2.png", "name": "name2" } { "imageUrl": "site/image3.png", "name": "name3" } { "imageUrl": "site/image4.png", "name": "name4" }Entonces, ¿cómo es que no están definidos? ¿Alguien puede ayudar?
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
no necesitas usar length
solo OBJs : entonces tendrá un elemento de matriz en cada iteración
si tienes una estructura como esta:
export default { data() { return { data: { OBJs: [ { "imageUrl": "site/image1.png", "name": "name1" }, { "imageUrl": "site/image2.png", "name": "name2" }, { "imageUrl": "site/image3.png", "name": "name3" }, { "imageUrl": "site/image4.png", "name": "name4" }, ] } }; } };interfaz de usuario:
<ul> <li v-for="item in data.OBJs" :key="item">{{item.imageUrl}}</li> </ul>
·
Juan Pablo Isaza
Denunciar
Responde la pregunta