Tengo una matriz llena de objetos de datos. Tengo un sistema de cuadrícula dentro de una función array.map que produce tarjetas que muestran los datos dentro de cada objeto en la matriz. Como un ket, configuré el índice de cada objeto dentro de la matriz (incluso probé usando el archivo doc como clave pero da el mismo resultado)

Mi cuadrícula no se procesa y en la consola aparece este error

 index.js:1 Warning: Each child in a list should have a unique "key" prop. Check the render method of `GridSystem`

Si consola. registro la función de mapa e imprimo el índice, obtengo 0,1 (porque solo tengo dos elementos)

Entonces no puedo encontrar cuál es el problema.

 <GridSystem colCount={2} md={6}> { myActivityList.map((card, index) => { console.log(index); <div className="card" key={index}> <img key={index} className="rounded-circle" alt="image" src={card.Photo} height={50} width={50} /> <div className="card-body"> <h5 className="card-title">{card.Title}</h5> <small className="card-text text-sm-center text-muted"> {card.Description} </small> <br /> <button //onClick={() => openActivityPage(card.activityId,card.Users,card.Partecipants)} className="btn btn-sm partecipate btn-primary" > Partecipa </button> </div> </div> }) } </GridSystem>

¡Gracias por su ayuda y tiempo!