Vue 3?

[9mm]

Hey I was wondering if there were plans to support Vue 3.

[masoudelahi]

Hey I was wondering if there were plans to support Vue 3.

i'm too

[masoudelahi]

is it compatible with Vue3 ?

[Agontuk]

It should work with vue 3 without any changes, please try & let me know if it's not the case.

[SmallComfort]

@Agontuk In vue3 the $listeners has been removed，I found $listeners is used in your code

[RichPC]

@Agontuk just tried it with vue3 and got the following error:

Uncaught TypeError: h is not a function
    at Proxy.render (VueCropper.js?95c3:19)

h needs to be imported with vue3

import { h } from 'vue'

but then as @SmallComfort pointed out the $listeners have gone too.

After importing h, and simply deleting the $listeners line it seems to work a treat in vue3.

[Agontuk]

I'll add vue 3 support asap, seems like it'll be a breaking change though.

[MarceloLuis1997]

+1

[Agontuk]

Master branch now contains vue 3 related changes, you can try & see if it works for you. I'll release a major version soon.

[matslindh]

For anyone wondering: since this.$refs isn't available in the new setup() in Vue3, you can get a reference to cropper by using ref:

setup(props) {
  const cropper = ref(null);
  return { cropper, }
}

The croppper reference will be populated with a reference to the actual cropperjs instance, and you can access the instance through cropper.value.

[Agontuk]

v5.0.0 has been published with vue 3 support