Estoy usando @chakra-ui/react versión 1.7.2 en mi proyecto React 17.0.2 .
Se supone que esta versión de Chakra UI resolvió el problema de tener claves únicas en sus elementos, pero todavía tengo el error cuando pruebo el código y en la consola de Chrome:
"Cada niño en una lista debe tener un accesorio de 'clave' único".
Agregar un accesorio de "clave" único manualmente no resuelve el problema. ¿Alguna sugerencia?
const MyComponent = () => { const myArray = ['London', 'Paris']; return ( <List> {myArray.map(city => ( <ListItem key={city}> <b>{city}</b> </ListItem> ) )} </List> ) };si tiene una identificación en el lado del objeto de la ciudad, asígnela como city.id etc. Si no, puede asignar una cadena única en el objeto de la ciudad que se devuelve. El único último recurso es utilizar el número de índice del elemento (no se recomienda, pero puede utilizarlo). Vea el código a continuación:
<List> {myArray.map((city, index) => ( <ListItem key={index}> <=========== (you can use city.<some_unique_id_here>) <b>{city}</b> </ListItem> ) )} </List>