RonaldJerez / vue-input-facade

A lightweight and dependency free input masking library created specific for Vue
https://ronaldjerez.github.io/vue-input-facade/latest/
183 stars 27 forks source link

Pass custom tokens with a directive #43

Closed hel-dev closed 2 years ago

hel-dev commented 2 years ago

Hello,

according to the documentation:

The directive has all the same features as the component, however the interface may not be as straight forward

But I can't figure out how to pass custom tokens in runtime since the only directive defined seems to be the facade one.

Thank you very much and keep up the good work!

RonaldJerez commented 2 years ago

I though I had a example of that in the docs.

you can pass an object to the directive instead of just a string, in which you can pass some of the configs including the tokens. The tokens will be merged with the default so you just need to supply new or updating existing tokens.

<input type="text" v-model="value" v-facade="{
  mask: 'XXX-###-AA',
  tokens: { 
    '#': { pattern: /[0-3]/ }
  }
}">
hel-dev commented 2 years ago

This is exactly what I was looking for!

Thank you very much @RonaldJerez!

RonaldJerez commented 2 years ago

Also want to point out that if this is not a one off then you can just pass the new token at initiation and it will apply to all your masks.

like it’s been done here: https://ronaldjerez.github.io/vue-input-facade/#advanced