Question

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

我希望重用此功能，而不必更改它，以接受来自HTML5输入的文件。

以下是我的意见：

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

这是我想要调用的函数：

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

问题是，当我从输入调用onUpload时，它不会传入一个Files数组。为了访问文件，我必须在我的onUpload函数中执行类似的操作：

 files = arrayOfFiles.target.files;

如何将Files数组本身传递给onUpload函数？

这不起作用：

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

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

Answer 1

将输入更改为以下功能：

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

React.js：HTML输入以传递文件onChange的数组

1 个答案: