Arrays

src/data/datos.json[
{
  "id": 1,
  "nombre": "Pepe",
  "edad": 23

},
{
  "id": 2,
  "nombre": "Sofía",
  "edad": 34

},
{
  "id": 3,
  "nombre": "Juan",
  "edad": 24

},
{
  "id": 4,
  "nombre": "Raquel",
  "edad": 44

},
{
  "id": 5,
  "nombre": "Andrés",
  "edad": 34

}
]
import datos from './data/datos.json';
const App = _ => (
  <div>
    {datos.map((dato, index) => {
      return <p key={index}>{dato.nombre}</p>
    })}
    </div>
);

Lista con componente anidado

const Dato = ({persona}) =>(
  <p>
    {persona.nombre} <br/>
    {persona.edad}
  </p>
);
      
const App = _ => (
  <div>
    {datos.map((dato, index) => {
      return <Dato key={dato.id} persona={dato} />
    })}
  </div>
);
icono de mandar un mail¡Contacta conmigo!
Pablo Monteserín
contacta conmigoPablo Monteserín

Para dudas técnicas sobre los ejercicios de mis cursos es necesario estar suscrito.