Search code examples
javascriptvue.jsvee-validateimaskjs

In vue-imask how do I get the IMask class?

My question is very similar to this one for angular: In angular-imask how do I get the IMask class? I'm especially interested about the Vue Composition API https://github.com/uNmAnNeR/imaskjs/tree/master/packages/vue-imask#mask-composable-vue-3 to be able to call mask.updateValue() in order to make it work with VeeValidate (ex: https://vee-validate.logaretm.com/v4/examples/value-formatting).

Here is the message I get from the console:

Element value was changed outside of mask. Syncronize mask using mask.updateValue() to work properly.

I've tried to retrieve the IMask class like that const { mask } = useIMask(formatterMask) but it is not the IMask class unfortunatly.

Any idea how to proceed? Thank you.

Solution

  • The IMask instance is indeed stored in mask returned from useIMask(). Since mask is a ref, you need to unwrap it via its .value property:

    const { mask } = useIMask(formatterMask)

console.log(mask.value) // => IMask instance