Hola, tengo un problema al devolver un valor de id (definido en el atributo key ) de la imagen cuando uso event.target .

 function imageClicked(event) { console.log(event.target.key); setClicked(event.target.key); shuffle(GameData); if (clicked.includes(event.target.key) === false) { setScore(score + 1); setClicked([...clicked, event.target.key]); } else { setScore(0); setClicked([]); } } ... <Display onClick={imageClicked} items={GameData} />

Y fragmento de componente:

 <div className="display"> <img src={props.image} alt={props.name} key={props.id} onClick={props.onClick} /> <p>{props.name}</p> </div>

Sin embargo, cuando estoy usando un atributo alt de la imagen, la aplicación funciona según lo previsto. Pero quiero cambiarlo de todos modos, ya que creé identificaciones para todas las imágenes y actualmente no se usan.

Gracias por adelantado.

Aquí está el enlace a la aplicación completa (usando el atributo alt ) en CodeSandbox.