首页 > 解决方案 > Dropzone.js 接受的文件不能与拖放一起使用

问题描述

我已将 Dropzone 设置为仅接受以下文件:

acceptedFiles:
      "application/vnd.openxmlformats-officedocument.wordprocessingml.document, application/msword",

还尝试了其他两种方式:

acceptedFiles: ".docx, .doc",

acceptedFiles:
      "application/vnd.openxmlformats-officedocument.wordprocessingml.document, application/msword, .docx, .doc",

但不适用于拖放。它仅适用于“可点击”选项,因此 fileInput 正在完成他的工作。

函数 getAcceptedFiles() 返回一个空数组[]。仅显示已删除文件的视觉效果。我错过了什么吗?我必须手动将它们从预览中排除?

谢谢你的帮助。

标签: dropzone.js

解决方案


似乎没有默认的实现。您必须实现拖放的逻辑。

    const maxFilesNumber = 1;
    //after complete adding files, remove if not accepted or maxFilesNumber reached
        dropzone.on("complete", (file) => {
          if (!file.accepted || dropzone.files.length > maxFilesNumber)
            dropzone.removeFile(file);
        });
    
    dropzone.on("maxfilesreached", () => dropzone.disable() );
    
    //reset event is fired when files in dropzone are 0
    dropzone.on("reset", () => dropzone.enable() );

推荐阅读