当前位置: 首页 > 工具软件 > DropzoneJS > 使用案例 >

java cropper_DropzoneJs:使用 CropperJS 裁剪图像后创建缩略图

赵俊侠
2023-12-01

我正在使用农作物 3.1.3 和DropzoneJS 5.2.0 这两个流行的 JavaScript 库来分别裁剪图像和 drop/upload 图像。

我将省略围绕 UI 的许多代码。在某一点上,我选择一个裁剪区域,然后按下“裁剪”按钮。按钮执行:

$image.cropper(

'getCroppedCanvas',

{fillColor: '#fff'}

)

.toBlob(function (blob) {

var croppedFile = blob;

croppedFile.lastModifiedDate = new Date();

croppedFile.name = fileName;

croppedFile.accepted = true;

var files = myDropzone.getAcceptedFiles();

for (var i = 0; i < files.length; i++) {

var file = files[i];

if (file.name === fileName) {

myDropzone.removeFile(file);

}

}

myDropzone.files.push(croppedFile);

myDropzone.emit('addedfile', croppedFile);

$cropperModal.modal('hide');

});

从此,我预计 blob(文件)将被发送到 dropzone 并添加,最后创建缩略图。但这不会发生。那么,如何使用 DropzoneJS 强制创建缩略图?

我有一个完整的 JSFiddle 这里来重现这个问题。

 类似资料: