Soy muy inexperto en reaccionar y estoy tratando de aprender la biblioteca jugando un poco.

Tengo problemas para pasar un objeto a otro componente. Creé una matriz de objetos que contiene 2 variables de cadena, 1 función y 1 int.

Estoy tratando de llenar esto dentro de un contenedor de cuadrícula (marco de interfaz de usuario de material).

Cuando paso el objeto al otro componente de reacción, llega como indefinido. Intenté verificar si estoy pasando un objeto válido registrándolo primero en la consola, y es válido.

También intenté referirme a las propiedades en el componente que recibe el objeto, pero la consola del navegador arroja Uncaught TypeError: Cannot read properties of undefined (reading 'person') .

¿Alguien sabe por qué se envía como indefinido?

ListaPersonas.js:

 const personListe = [ { firstName:'testFirstname', lastName:'testLastName', getFullName:function() { return `${this.firstName} ${this.lastName}` }, age:28 } ] export default function PersonList() { return ( <> <Grid container spacing={3}> {personListe.map((person) => { return( <Grid item xs={3} key={person.firstName}> <PersonCard person={person} /> </Grid> ) })} </Grid> </> ); }

PersonCard.js:

 export default function PersonCard({props}) { return (<> {console.log(props)} </>) }