Dropzone：绑定到 init

Question

我正在关注 this tutorial 将现有文件模拟为启用 Dropzone 的表单，但无法连接到 init 函数。这是我目前所拥有的：

var imageUpload;

if ($('.js-listing__images-upload').length) {
  imageUpload = new Dropzone('.js-listing__images-upload', {
    addRemoveLinks: true,
    maxFiles: 5,
    maxFilesize: 3,
    acceptedFiles: 'image/jpeg,image/png,image/gif'
  });
  imageUpload.on('init', function() {
    var listingID, thisDropzone;
    console.log('dropzone init');
    thisDropzone = this;
    listingID = $('#manage-images').data('listing');
    $.ajax({
      url: dashboard.images.list,
      data: {
        listing: listingID
      },
      success: function(data) {
        console.log('ajax for list done');
        $.each(data, function(key, value) {
          var mockFile;
          mockFile = {
            name: value.name,
            size: value.size
          };
          thisDropzone.options.addedfile.call(thisDropzone, mockFile);
          thisDropzone.options.thumbnail.call(thisDropzone, mockFile, '/uploads/thumb/listings/' + value.name);
        });
      }
    });
  });
}

None 我的 console.log() 着火了，但我不确定问题出在哪里。按照 Dropzone 的配置，我应该能够使用简单的 on 机制连接到事件。谢谢大家！

更新

以下内容有效：

# When images are removed
# Dropzone
imageUpload.on 'removedfile', (file) ->
  if file.xhr
    imageID = JSON.parse file.xhr.response
    $.ajax
      url: dashboard.images.destroy
      data: { image: imageID }
      success: () ->
  return

所以我在使用 init 函数时遇到了问题。

Answer 1

init 函数可以直接绑定到您的新 Dropzone 实例：

if $('.js-listing__images-upload').length
  imageUpload = new Dropzone(
    '.js-listing__images-upload',
    addRemoveLinks: true
    maxFiles: 5
    maxFilesize: 3
    acceptedFiles: 'image/jpeg,image/png,image/gif'
    init: ->
      thisDropzone = this
      $.ajax
        url: dashboard.images.list
        data: { listing: $('#manage-images').data('listing') }
        success: (data) ->
          $.each data, (key, value) ->
            mockFile =
              name: value.name
              size: value.size
            thisDropzone.options.addedfile.call thisDropzone, mockFile
            thisDropzone.options.thumbnail.call thisDropzone, mockFile, '/uploads/thumb/listings/' + value.name
            return
          return
      return
  )

Dropzone：绑定到 init

Dropzone: Binding to init

javascript

jquery

file-upload

dropzone.js

jquery-events

更新