Реагировать на ввод файла работает только один раз - PullRequest
Новая
       8

Реагировать на ввод файла работает только один раз

2 голосов
/ 16 июня 2020

У меня есть функциональный компонент с входом для загрузки файлов. Этот компонент отлично работает, если я добавлю, например, файл .csv с именем 1.csv. Он также работает с дополнительными файлами, которые я загружаю впоследствии, например, 2.csv или 3.csv, и если я изменю порядок (например, сначала 3.csv, затем 1.cav, затем 2.csv), все будет в порядке. Если я загружаю 1.csv, а затем снова загружаю 1.csv без каких-либо других загрузок между ними, событие onChange не запускается. Любые идеи, что предотвращает событие onChange, если файл идентичен предыдущему?

Мой компонент: 

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>
);
};

Я думаю, это потому, что ввод файла всегда является неконтролируемым компонентом в реакции. Есть идеи, как запустить его, даже если это один и тот же файл x раз подряд?

Заранее спасибо :)

1 Ответ

1 голос
/ 16 июня 2020

можно так: 

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