Блог

когда я загружаю новое изображение с помощью cropper js, оно дублирует обрезку следующим образом:

Вот мой код о том, как я обрабатываю всю загрузку и повторную загрузку:

 $(window).ready(function() {
    function cropImage($image, input, trigger, preview, output, options) {
        input.change(function() {
            var oFReader = new FileReader();

            oFReader.readAsDataURL(this.files[0]);

            oFReader.onload = function (oFREvent) {
                let cropper = null;

                // Cropper instance
                cropper = new Cropper(
                    $image[0], 
                    options
                );
                
                // Destroy Cropper Instance
                cropper.destroy();

                $image[0].setAttribute('src', this.result);

                trigger.removeClass('disabled').addClass('active');
                
                // Create New cropper instance after destorying
                cropper = new Cropper(
                    $image[0], 
                    options
                );

                cropperPreview(trigger, $image,preview, cropper, output);
            };
        });
    }
 

Я последовал совету создателя плагина использовать метод replace, но это тот же результат.

возможно, вам придется изучить destroy() amp; re-init .. надеюсь, это решит вашу проблему.