javascript - Dropzone - 最大文件数不起作用

Question

我尝试过设置上传文件的限制为仅一个。我已经尝试了之前问题 here 中的所有建议但对我来说没有任何作用。每次我都能够上传多个文件，并且可以上传尽可能多的文件。

这是我的尝试之一:

var token = "{{ csrf_token() }}";
Dropzone.autoDiscover = false;
 var myDropzone = new Dropzone("div#dropzoneFileUpload", {
     url: "/admin/upload",
     params: {
        _token: token
      }
 });
 Dropzone.options.myAwesomeDropzone = {
    paramName: "file", // The name that will be used to transfer the file
    maxFilesize: 2, // MB
    addRemoveLinks: true,
    maxFiles: 1,
    init: function() {
      this.on("maxfilesexceeded", function() {
        if (this.files[1]!=null){
          this.removeFile(this.files[0]);
        }
      });
    },
    accept: function(file, done) {

    }
  };

这就是我调用脚本的方式:

<script src="{{ asset('js/dropzone/dropzone.js') }}"></script>
<script src="{{ asset('js/image-upload.js') }}"></script>

Answer 1

您将 dropzone 配置分为两种不同的方法。并且仅使用第一个包含 url 选项的选项，第二个包含 maxFiles 选项的选项将被忽略。

您必须将所有配置包含在第一个以编程方式创建 dropzone 的方法中，如下所示:

Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("div#dropzoneFileUpload", {
    url: "/admin/upload",
    params: {
       _token: token
    },
    paramName: "file", // The name that will be used to transfer the file
    maxFilesize: 2, // MB
    addRemoveLinks: true,
    maxFiles: 1,
    init: function() {
      this.on("maxfilesexceeded", function() {
        if (this.files[1]!=null){
          this.removeFile(this.files[0]);
        }
      });
    },
    accept: function(file, done) {

    }
 });

或者使用使用 dropzone 自动发现功能的第二种方法，如果您的 dropzone 元素具有 id #dropzoneFileUpload ，请执行以下操作:

 Dropzone.options.dropzoneFileUpload = {
    url: "/admin/upload",
    params: {
       _token: token
    },
    paramName: "file", // The name that will be used to transfer the file
    maxFilesize: 2, // MB
    addRemoveLinks: true,
    maxFiles: 1,
    init: function() {
      this.on("maxfilesexceeded", function() {
        if (this.files[1]!=null){
          this.removeFile(this.files[0]);
        }
      });
    },
    accept: function(file, done) {

    }
};