Esta línea const files = Array.from(e.target.files); produce un error en mecanografiado.
Soy novato en mecanografiar. Parece que el objeto no es como una matriz, pero en realidad lo es. ¿Qué puedo hacer para arreglar esto?
el error es:
"Ninguna sobrecarga coincide con esta llamada. La sobrecarga 1 de 4, '(iterable: Iterable | ArrayLike): File[]', generó el siguiente error. El argumento de tipo 'FileList | null' no se puede asignar al parámetro de tipo 'Iterable | ArrayLike '. El tipo 'null' no se puede asignar al tipo 'Iterable | ArrayLike'. La sobrecarga 2 de 4, '(arrayLike: ArrayLike): File[]', generó el siguiente error. El argumento de tipo 'FileList | null' no se puede asignar al parámetro de tipo 'ArrayLike'. El tipo 'null' no se puede asignar al tipo 'ArrayLike'".
Aquí está el código:
import { ChangeEvent } from 'react'; import './styles.css'; export function App() { const handleFileLoad = function (e: ChangeEvent<HTMLInputElement>) { const files = Array.from(e.target.files); // I want to use forEach here, so I attempt to convert it to an array. }; return ( <div> <input type="file" onChange={handleFileLoad} /> </div> ); }La razón por la que recibe un error es porque los files en e.target.files pueden ser nulos, lo que puede causar que Array.from(e.target.files) se equivoque, por lo que TypeScript le solicita que proporcione una caída -Regreso a ese escenario.
e.target.files devuelve una lista de FileList | null , puede obtener información sobre FileList aquí .
Puede ver que puede iterar sobre los archivos con un bucle for normal:
for(let i = 0; i < files.length; i++) { const file = files[i]; // get single file from files array // do anything you want with the file }Encontré la respuesta. Esto hará el trabajo:
const files = Array.from(e.target.files as ArrayLike<File>);Podemos considerar FileList como un ArrayLike que contiene elementos
Por alguna razón, mecanografiado no logró adivinarlo por sí solo.