Я использовал vuedropzone. Но прежде чем изображение будет добавлено в зону сброса, оно должно быть сначала обрезано. Как я могу интегрировать кроппер js с vuedropzone?
Вот мой исходный код.
<template>
<div>
<vue-dropzone
@vdropzone-sending="sendingDropzone"
@vdropzone-success="showSuccessDropzone"
@vdropzone-error="showErrorDropzone"
@vdropzone-file-added="fileAddedDropzone"
@vdropzone-removed-file="fileRemovedDropzone"
:options="dropzoneOptions"
:use-custom-dropzone-options="true"
ref="dropZone"
id="dropzone"
class="dropzone-container"
></vue-dropzone>
</div>
</template>
<script>
import vue2Dropzone from 'vue2-dropzone';
import 'vue2-dropzone/dist/vue2Dropzone.min.css';
import 'cropperjs/dist/cropper.css';
import Cropper from 'cropperjs';
export default {
data() {
return {
dropzoneOptions: {
url: `myurl/uploadfile`,
autoProcessQueue: false,
uploadMultiple: false,
addRemoveLinks: true,
acceptedFiles: '.jpg,.jpeg,.png',
thumbnailWidth: 150,
maxFiles: 1,
maxFilesize: 130,
dictDefaultMessage: "<i class='fa fa-cloud-upload'></i> Choose Photo",
headers: {
'X-CSRF-TOKEN': document.head.querySelector('meta[name="csrf-token"]').content
}
}
}
},
methods: {
sendingDropzone(file, xhr, formData) {
}
showSuccessDropzone(file, response) {
}
showErrorDropzone(file, response) {
}
fileAddedDropzone(file) {
}
fileRemovedDropzone(file) {
}
}
}
</script>
Где я могу вставить код для обрезки изображения перед его добавлением в dropzone? Я действительно смущен. Пожалуйста, помогите мне. Или у вас есть образец для vuedropzone с кроппер js? Пожалуйста, скажи мне. Спасибо!