如何重置ReactJS文件输入 [英] How to reset ReactJS file input

问题描述

我有文件上传输入：

<input onChange={this.getFile} id="fileUpload" type="file" className="upload"/>

我以这种方式处理上传：

And I handle upload this way:

getFile(e) {
    e.preventDefault();
    let reader = new FileReader();
    let file = e.target.files[0];
    reader.onloadend = (theFile) => {
        var data = {
            blob: theFile.target.result, name: file.name,
            visitorId:  this.props.socketio.visitorId
        };
        console.log(this.props.socketio);
        this.props.socketio.emit('file-upload', data);
    };
    reader.readAsDataURL(file);
}

如果我上传同一个文件两次，则不会触发上传事件。我该如何解决这个问题？对于简单的js代码，它足以执行以下操作：this.value = null;在变更处理程序。我怎么能用ReactJS做到这一点？

If I upload same file twice, then upload event is not fired. How can I fix that? For simple js code it was enough to do the following: this.value = null; in change handler. How can I do it with ReactJS?

推荐答案

我认为你可以像这样清除输入值：

I think you can just clear the input value like this :

e.target.value = null;

无法控制文件输入，没有特定于React的方法。

File input cannot be controlled, there is no React specific way to do that.

这篇关于如何重置ReactJS文件输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！