ファイルのアップロードから大きなファイルを削除する

Question

私はAjaxで複数のファイルをアップロードできるようにしたいと考えています。一部のファイルが大きすぎる場合は、アップロードリストから削除したいと考えています。これをやり遂げるにはどうすればいいですか？私は現在、自分の入力フィールドに次のものを持っています。

<input id="file" type="file" onChange={this.handleChange.bind(this)} required multiple /> 

これまでのところ、私は大きすぎてどのファイルを検証するために、このようなものが出ている：彼らは本当にリンクでないとして、私は混乱しています事は、ファイルの処理方法である

handleChange(event) { 
    const target = event.target; 

    if (target.type === 'file'){ 
     console.log("FILES") 
     const files = target.files 
     console.log("The following files are too large") 
     for (let i=0; i < files.length; i++){ 
      if (files[i].size > 50000){ 
       console.log(files[i].name) 
      } 
     } 
    } 
} 

ファイルシステム上の実際のファイルにコピーします。ファイル構造はどのように機能しますか？良いファイルをAjaxでアップロード可能な新しいファイル構造に保存するにはどうすればいいですか？

Answer 1

target.filesは単なる配列です。あなたはそれを簡単にフィルタリングし、不要なファイルを削除し、新しい配列で必要な操作を行います（たとえば、コンポーネントの状態に保存するなど）。 XMLHTTPRequestを経由FormDataオブジェクトを送信後、

const data = new FormData(); 
files.forEach(file => data.append(file.name, file)); 

と：あなたが実際にXMLHTTPRequestを経由してファイルを送信する方法を求めているならば、これはFormDataで行うことができます

const files = target.files.filter(file => file.size <= 50000); 
this.setState({files}); 
// or uploadFiles(files) 

。