React.js：用于传递文件数组的 HTML 输入 onChange答案

【问题标题】：React.js: HTML Input to pass array of Files onChangeReact.js：用于传递文件数组的 HTML 输入 onChange
【发布时间】：2017-07-23 00:13:32
【问题描述】：

我有一个接受文件数组的函数。

我想重用这个函数，而不必更改它，以接受来自 HTML5 输入的文件。

这是我的输入：

 render() {
   return (
    <div>
      <form>
        <input className="fileInput" 
          type="file" 
          onChange={this.onUpload.bind(this)} />
     </form>
   </div> 
 )}

这是我要调用的函数：

 onUpload(arrayOfFiles) {
   // do something with files
 }

问题是，当我从输入中调用 onUpload 时，它没有传入文件数组。为了访问这些文件，我必须在我的 onUpload 函数中做这样的事情：

 files = arrayOfFiles.target.files;

如何将文件数组本身传递给我的 onUpload 函数？

这行不通：

<form>
  <input className="fileInput" 
   type="file" 
   onChange={this.onUpload.bind(this.target.files)} />
</form>

我收到错误“无法读取未定义的属性‘文件’”

【问题讨论】：

.apply 而不是 .bind?
@zer00ne，与 .apply 相同的错误

标签： javascript reactjs input

【解决方案1】：

将输入更改为以下内容即可：

<input className="fileInput" 
   type="file" 
  onChange={(e) => this.onUpload(e.target.files)} />

【讨论】：