Dropzone配置maxFiles为1时上传报错后无法继续上传问题

问题原因 #

Dropzone 默认会将所有添加的文件（无论上传成功还是失败）都计入maxFiles的统计数量。当配置maxFiles: 1时，单次上传触发error事件后，组件内部统计的已上传数量已经变为1，因此会触发 You can not upload any more files 的提示，拒绝后续上传请求，属于默认统计逻辑的误判。

修复方法 #

在error事件的回调中，调用Dropzone实例的removeFile()方法手动移除上传失败的文件，即可清空计数恢复上传能力，修改后的配置代码如下：

$(this.element).dropzone({
      maxFiles: 1,
      createImageThumbnails: false,
      dictDefaultMessage: '',
      clickable: true,
      paramName: this.paramNameValue,
      url: this.urlValue,
      method: this.methodValue,
      init: function() {
        const dropzoneInstance = this
        this.on("error", (fileObject, response) => {
          let msg
          try {
            msg = JSON.parse(response).join(', ')
          } catch (e) {
            msg = response;
          }
          console.log('error', msg)
          // 手动移除上传失败的文件，重置maxFiles统计计数
          dropzoneInstance.removeFile(fileObject)
        });
      }
    })

如果希望保留失败文件的展示仅重置计数，可以修改为直接调整内部统计值dropzoneInstance.files.length = 0，不调用removeFile即可。

内容的提问来源于stack exchange，提问作者estani