文件上传后如何清除React Dropzone组件中的Dropzone？

Question

我需要在文件上传后销毁 dropzone 组件，无法获取 dropzone 对象以应用 dropzone.destroy() 方法。

Answer 1

要清除拖放区，我们需要获取拖放区对象并使用dropzone.destroy() 方法。我们需要先在完整组件外初始化一个变量为：

var myDropzone;

要获取 dropzone 对象，我们需要使用 dropzone 的 init 事件，它为我们提供如下所示的 dropzone 对象：

initCallback (dropzone) {
        myDropzone = dropzone;
        console.log("dropzone"+myDropzone);
    }
const eventHandlers = {
            addedfile: this.onDrop.bind(this),
            removedfile: this.removeFile.bind(this),
            init: this.initCallback.bind(this)
    }

然后我们可以在上传完成后调用dropzone.destroy()方法，像这样：

myDropzone.destroy();

它会将我们的文件数组重置为 [] 并将文件也从视图中删除。

文件上传后如何清除React Dropzone组件中的Dropzone？

How to clear the Dropzone in React Dropzone Component after file upload?

reactjs

react-dropzone