Estoy tratando de hacer una función de arrastrar y soltar con algunos archivos. Quiero hacer que cuando un usuario arrastre y suelte varios archivos, todos esos archivos se agreguen a una lista. Sin embargo, solo uno de los archivos que se arrastran termina siendo agregado a la lista y no estoy seguro de por qué. así es como estoy actualizando el estado de la lista de archivos:
files.forEach(element => { onFileAdded({ file_list: [ ...file_list, element ] }) }); Archivos es esencialmente lo que el usuario arrastra y cuando lo registro, se ve así: 
En mi cabeza, asumiría que cada archivo en archivos se repetiría y agregaría a file_list.
onFileAdded es el método que estoy usando para actualizar el estado de file_list . Sin embargo, si arrastro y suelto varios archivos, noto que en lugar de agregar todos los archivos a la lista de archivos, solo se agrega uno de ellos. Tengo la sensación de que esto tiene algo que ver con la forma en que estoy usando el operador de propagación, pero no estoy 100% seguro. Cualquier idea sería útil.
Supongo que usaste el elemento <input type={"file"} multiple /> . Digamos que tiene una matriz vacía y desea actualizarla.
const [arr,setArr] = useState([]) const onChange = e=> { const {files} = e.target; const tempArr = []; for (let i = 0, len = files.length; i < len; i++) { tempArr.push(files[i]); } setArr(prev=> ([...prev,...tempArr])) } return ( <input onChange={onChange} type={"file"} multiple /> )