我正在使用农作物 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 这里来重现这个问题。