Quiero insertar un objeto en una matriz una cantidad aleatoria de veces y hacer que cada objeto tenga su propia identificación única. Actualmente, puedo insertar ese objeto en la matriz una cantidad aleatoria de veces, pero obtengo "Cada niño en una lista debe tener un accesorio de" clave "único". error. Cuando consuelo. registro la matriz, veo que cada objeto tiene la misma clave.
Tengo un código configurado para generar una identificación única, pero parece que no funciona.
Aquí está mi objeto de datos que estoy llamando:
let id = Math.random().toString(16).slice(2); export const data = { key: id, asylumOffice: 'AyS', citizenship: 'h', raceOrEthnicity: 'other', caseOutcome: 'pending', completion: 'n', currentDate: 'f', };Y el código donde lo estoy llamando y generando una cantidad aleatoria:
let dataArray = []; let randomNum = Math.floor(Math.random() * 10); for (let i = 0; i < randomNum; i++) { dataArray.push(data); }Entiendo que el ciclo for está presionando la misma instancia de datos y es por eso que todos tienen la misma identificación, pero no sé cómo hacerlo para que cada uno tenga la suya. ¿Alguna sugerencia?
Si desea generar identificaciones realmente únicas, debe usar uuid.
Aquí está el paquete npm . Es bastante fácil de configurar y usar.
De los documentos de React para listas y claves :
La mejor manera de elegir una clave es usar una cadena que identifique de forma única un elemento de la lista entre sus hermanos.
Entonces, las claves no necesitan ser aleatorias: solo necesitan ser únicas entre hermanos . Y por esa razón, usar un entero simple para una clave fija está bien:
const count = Math.floor(Math.random() * 10); const dataArray = [...new Array(count).keys()].map(key => ({...data, key}));Si no le importa correr el riesgo de una colisión de números aleatorios en los identificadores, simplemente distribuya nuevos identificadores aleatorios en sus objetos a medida que construye la matriz. Podría hacerlo así:
const randomCopies = (data) => [...Array (Math .floor (Math .random () * 10))] .map(() => ({ id: Math .random() .toString(16) .slice (2), ... data })) const data = {asylumOffice: 'AyS', citizenship: 'h', raceOrEthnicity: 'other', caseOutcome: 'pending', completion: 'n', currentDate: 'f'} console .log (randomCopies (data)) .as-console-wrapper {max-height: 100% !important; top: 0}Pero si esto es solo para evitar colisiones, entonces un número secuencial será más limpio y podría hacer esto en su lugar:
const seqNumber = ((n) => () => ++n) (0) const randomCopies = (data) => [...Array (Math .floor (Math .random () * 10))] .map(() => ({ id: seqNumber(), ... data })) const data = {asylumOffice: 'AyS', citizenship: 'h', raceOrEthnicity: 'other', caseOutcome: 'pending', completion: 'n', currentDate: 'f'} console .log (randomCopies (data)) .as-console-wrapper {max-height: 100% !important; top: 0} En cualquier caso, esto elegirá un número aleatorio de copias de 0 a 9 . Si desea del 1 al 10 , deberá agregar 1 a los resultados de la llamada Math.floor .