jquery - 如何使用 Dropzone.js 在预览中使用实际图像而不是缩略图

Question

上传后，会显示文件的缩略图，因为最终只会上传 gif，我如何才能在预览中显示实际的 gif，而不是 png 缩略图？在其他地方看到它完成，但我认为需要编辑 dropzone.js，有人在这里完成此操作并可以告诉我如何做吗？

谢谢!!

Answer 1

无需编辑 dropzone.js。更改其配置。您可以使用 Dropzone 的“addedFile”。在addedFile函数中，您可以获得添加到dropzone的所有文件的base64值。下面是我使用的代码:

this.on("addedfile", function (file) {
     var temp = file.previewTemplate;
     var FR= new FileReader();
     FR.onload = function(e) {
         console.log( e.target.result); //This is the base64 data of file(gif) dropped
         //if you want to display it somewhere in your previewTemplate
         temp.find('.my-preview').attr('src',e.target.result); //setting as src of some img tag with class 'my-preview'
     };
     FR.readAsDataURL( file );
});

希望这能解决您的目的。