preview - 如何将图像预加载到dropzone.js中

Question

我在网页上有一个dropzone.js实例，具有以下选项:

autoProcessQueue:false
uploadMultiple:true
parallelUploads:20
maxFiles:20

它是较大形式的一部分，因此已通过编程方式实例化。我已将其组装起来，以便在提交表单时处理队列。

我们的目标是使我的用户能够使用dropzone来管理商品的图像，因此，当我加载商品的“edit / update” View 时，我想将以前曾经存储过的图像预加载到dropzone中为该项目上传。是否有一种很好的方法来实现这一点，以使已经存在的项目在将其更改提交到图像列表时不会被重新上传？

Answer 1

正确的方法是使用dropzone js上提供的.emit方法添加文件和缩略图，以从服务器预加载图像。请参见下面的示例代码。取自https://github.com/enyo/dropzone/wiki/FAQ#how-to-show-files-already-stored-on-server

// Create the mock file:
var mockFile = { name: "Filename", size: 12345 };

// Call the default addedfile event handler
myDropzone.emit("addedfile", mockFile);

// And optionally show the thumbnail of the file:
myDropzone.emit("thumbnail", mockFile, "/image/url");

dropzone中的.emit方法将触发init函数，如果您为此编写了任何addfile事件回调。例如我正在使用addfile事件添加删除按钮，还附加了删除图像功能。