Al hacer clic en un botón, llamo a una función para establecer una ID única de un objeto y luego empujo el objeto dentro de una matriz:
const addItems = (item) => { item.uniqueId = addedItems.length + 1; addedItems.push(item); };Funciona según lo previsto si agrego los elementos lentamente, pero si presiono varias veces por segundo el botón, la identificación única será la misma (y una incorrecta, no la que está en línea: por ejemplo, si tengo 2 elementos en el matriz con identificación única de 1 y 2 y luego presione rápidamente el botón 3 veces, esos 3 objetos tendrán una identificación única de 5, los 3). ¿Que esta mal aquí?
Suponiendo que esté en estado, siempre debe actualizarlo de manera inmutable :
setAddedItems(ps=>[...ps,{...item,uniqueId:ps.length+1}])Y, de hecho, de esta manera, como se menciona en otra respuesta, si elimina elementos y luego agrega otros nuevos, las identificaciones pueden repetirse; pero si los elementos no se eliminan, entonces este enfoque está bien.
También puede verificar uuid si también desea eliminar elementos.
Su código tiene muchas desventajas, le recomiendo que use nanoid . Si eliminará el elemento de su estado de uso, algunas identificaciones podrían ser las mismas. Mejor use un índice para esto si no cambiaría su estado (eliminar elementos)
Se verá como:
const addItems = (item) => { setAddedItems((addedItems) => [ ...addedItems, { ...item, uniqueId: nanoid() } ]) }