reactjs - React filinngang fungerer bare én gang


Jeg har en funksjonskomponent med et input for filopplasting. Denne komponenten fungerer fint hvis jeg legger til for eksempel en .csv-fil kalt 1.csv. Den fungerer også for tillegg filer som jeg laster opp etterpå som 2.csv eller 3.csv, og hvis jeg endrer rekkefølgen (for eksempel først 3.csv, deretter 1.csv, så 2.csv) er alt i orden. Hvis jeg laster opp 1.csv og deretter laster opp 1.csv igjen uten andre opplastinger imellom, blir ikke onChange-hendelsen utløst. Noen ideer om hva som hindrer onChange-hendelsen hvis filen er identisk med den forrige?

Min komponent:

interface UploadInputProps {
  accept?: string;
  label?: string;
  onChange?: (value: any) => void;
}

const UploadInput: React.FC<UploadInputProps> = ({ accept, label, onChange }) => {
return (
<Container style="align-items: center">
  <div className="upload-btn-wrapper">
    <label className="uploadBtn">
      <i className="fal fa-file-import uploadIcon" />
      <input type="file" name="fileUpload" title=" " accept={accept} onChange={onChange} />
      {label}
    </label>
  </div>
</Container>
);
};

Jeg antar det er fordi en filinnføring alltid er en ukontrollert komponent i React. Noen ideer om hvordan man kan utløse den selv om det er den samme filen x ganger på rad?

Takk på forhånd :)

Svar #1

du kan gjøre dette:

<input type="file" name="fileUpload" title=" " onChange={(e)=> {this.readFile(e) e.target.value=null }}/>

Relaterte artikler