nhn / tui.image-editor

🍞🎨 Full-featured photo image editor using canvas. It is really easy, and it comes with great filters.
http://ui.toast.com/tui-image-editor
MIT License
6.87k stars 1.27k forks source link

Cannot call crop in Vue #668

Open jonatanvm opened 2 years ago

jonatanvm commented 2 years ago

Describe the bug Calling crop causes error.

To Reproduce Steps to reproduce the behavior:

Call crop method in Vue methods. Code:

applyCrop() {
     let cropZone = this.$refs.tuiImageEditor.invoke('getCropzoneRect')
     this.$nextTick(() => {
          this.$refs.tuiImageEditor.invoke('crop', cropZone)
     })
}

Error:

vue.runtime.esm.js?2b0e:1897 TypeError: Cannot read properties of null (reading '_set')
      at klass._onObjectAdded (tui-image-editor.js?abe2:9314)
      at klass.add (tui-image-editor.js?abe2:399)
      at Cropper.getCroppedImageData (tui-image-editor.js?abe2:50660)
      at Graphics.getCroppedImageData (tui-image-editor.js?abe2:57016)
      at ImageEditor.crop (tui-image-editor.js?abe2:58891)
      at VueComponent.invoke (toastui-vue-image-editor.js?feca:2)
      at VueComponent.eval (EditImageDialog.vue?b80e:234)
      at Array.eval (vue.runtime.esm.js?2b0e:1989)
      at flushCallbacks (vue.runtime.esm.js?2b0e:1915)

Expected behavior Should not throw error.

Desktop (please complete the following information):

lja1018 commented 2 years ago

@jonatanvm Thank you for the report. I'll check the bug and resolve it.

Toflyer commented 1 year ago

It seems that this issue is still ongoing:

// this.imageEditorInstance.crop(this.imageEditorInstance.getCropzoneRect());

TypeError: Cannot read properties of null (reading '_set')