0
84
Vistasv-for en la ruta de la matriz // vuejs
En la captura de pantalla adjunta quiero llegar al content . Estoy tratando de llegar a él con element.comments.content pero no funciona, vea el código a continuación:
<div class="fil-actualites-container"> <div class="posts" v-for="(element, index) in postArray" :key="index"> <p>{{ element.title }}</p> <p>{{ element.content }}</p> <p>{{ element.likes.length }}</p> <button @click="addLike(element._id)">Add Like</button> <br /> <input type="text" v-model="contentComment" @keydown.enter="addComment(element._id)" placeholder="add Comment" /> <p>{{ element.comments.content }}</p> </div> 
2 Respuestas
Responde la pregunta0
comments es una matriz ( [] ) dentro de la matriz de posts .
Por lo tanto, debe recorrer eso para acceder a los valores que contiene. No sé su caso de uso exacto, pero algo como esto:
<div class="fil-actualites-container"> <div class="posts" v-for="(element, index) in postArray" :key="index"> <div v-for="(comment, i) in element.comments" :key="`comment-${i}`"> <p>{{ comment.title }}</p> <p>{{ comment.content }}</p> <p>{{ comment.likes.length }}</p> <button @click="addLike(comment._id)">Add Like</button> <br /> <input type="text" v-model="contentComment" @keydown.enter="addComment(comment._id)" placeholder="add Comment" /> <p>{{ comment.content }}</p> </div> </div>He agregado otro bucle dentro del existente para recorrer los comentarios y acceder a los valores.
0
Los comentarios están relacionados con las publicaciones. Una publicación puede tener varios comentarios. Si ahora recorre las publicaciones, llegará a los comentarios clave. Los comentarios también deben pasar por un bucle en este punto. La relación oneToMany es la razón por la que debe incluir un ciclo de comentarios dentro de su ciclo de publicación. Esto le da acceso a todos los comentarios. Espero que esto te ayude sin escribir mucho código.