Is it possible to dynamically remove a directive with Vuejs?

Question

I would like to know if it is possible to remove a directive dynamically with Vuejs Ex:

<v-text-field
  v-mask="'XX:XX'"
></v-text-field>

props: {
  mask: { type: String, default: '' }
}

computed: {
  getMask() {
    return this.mask || '';
  }
}

At some point there is the possibility of ownership mask come as an empty string, and this generates an error in the directive v-mask I am using the plugin vue-the-mask!

Thank you!

Answer 1

You can change the component if you don’t have a mask.

<v-text-field
  v-if="mask"
  v-mask="'XX:XX'"
></v-text-field>
<v-text-field
  v-else
></v-text-field>