Por alguna razón, no estoy representando el elemento, pero aparece el mapeo de los artículos. ¿Puede alguien ayudarme a entender qué es lo que me estoy perdiendo?
import React from "react"; import Article from "./Article"; import { v4 as uuidv4 } from "uuid"; // ArticleList // Make an ArticleList component as a child of App. It should return: // a <main> element with the following components inside: // an array of Article components (one component for each post passed down as a prop to ArticleList) // make sure to assign a unique key prop to each Article // {blogDataArr} // (3) [{…}, {…}, {…}] // 0: {id: 1, title: 'Components 101', date: 'December 15, 2020', preview: 'Setting up the building blocks of your site', minutes: 5} // 1: {id: 2, title: 'React Data Flow', date: 'December 11, 2020', preview: 'Passing props is never passé', minutes: 15} // 2: {id: 3, title: 'Function vs Class Components', preview: 'React, meet OOJS.', minutes: 47} // length: 3 // [[Prototype]]: Array(0) function ArticleList({ blogDataArr }) { let mapping = blogDataArr.map((row) => { return ( <Article key={uuidv4()} title={row.title} date={row.date} preview={row.preview} /> ); }); return <main>{mapping}</main>; } export default ArticleList;:EDITAR: agregar la etiqueta del artículo para mayor referencia.
import React from "react"; function Article({ title, date = "January 1, 1970", preview }) { return ( <article> <h3>{title}</h3> <small>{date}</small> <p>{preview}</p> </article> ); } export default Article;