【问题标题】:Dropzone.js autoProcessQueue not working within Vue componentDropzone.js autoProcessQueue 在 Vue 组件中不起作用
【发布时间】:2018-11-28 17:33:36
【问题描述】:

我在 Vue 组件中使用 dropzone.Js,我正在尝试提交仅在单击提交按钮后才会出现 dropzone 的表单。

HTML:

<div class="form-group">
    <label for="dropzone-js" class="col-md-12 control-label">Choose a profile picture:</label>
    <!-- even though there is not path in the action there is still a post request -->
    <form action="#"
     class="dropzone"
     id="dropzone-js"></form>
</div>

打印屏幕:

Vue组件脚本:

 ready(){
  // I´ve tried to implement the autoProcessQueue to false in many ways, but 
  // withouth the desired result
  Dropzone.forElement(".dropzone").options.autoProcessQueue = false;
  Dropzone.options.autoProcessQueue = false;

  new Dropzone('#dropzone-js', {
    paramName: "profileImg", // The name that will be used to transfer the file
    maxFilesize: 2, // MB
    maxFiles: 1,
    autoProcessQueue:false,
    autoProcessQueue: false,
    uploadMultiple: false,
    accept: function(file, done) {
            console.log('event',event)

            console.log('accepted dropzone file', file)
            this.form.photo = file
            // done();
    },

    init: function() {
        this.on("addedfile", function(file, event) { 
            // this.form.photo = file
            // alert("Added file."); 
            console.log('event',event)
        });
    },
    init: function() {
            this.on("maxfilesexceeded", function (file) {
                    alert('Only 1 file allowed')
                    this.removeFile(file);
            });
    }
})
},

我仍然不确定我在这里缺少什么,但由于这是我第一次同时使用这两种方法,所以我对使用规范非常迷茫。

【问题讨论】:

    标签: vue.js dropzone


    【解决方案1】:

    我找到了一种解决方法,我认为不建议这样做。如果有人知道更好的,请发表评论。

    我必须编辑 dropzone.js 源代码并设置 autoProcessQueue = false,如下所示:

    我认为 dropzone 对象的本地设置无法覆盖全局 autoProcessQueue 配置。

    【讨论】:

      猜你喜欢
      • 2014-10-01
      • 2017-06-28
      • 2017-08-20
      • 2017-11-21
      • 1970-01-01
      • 2013-10-08
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多