Dynamically binds a mask for optional brazilian cell phone number

vmask.vue

<template lang="pug>
  form
    input(type=text)(v-model=celphone)(v-mask=celphoneMask)
</template>

<script>
export default {
  name: 'mycomponent',
  data() {
    return  {
      celphone: '',
      celphoheMask: '(##) ####-####?#'
    }
  },
  watch: {
    celphone: function() {
      if(this.celphone.length > 14) {
        this.mask = '(##) #####-####'
      } else {
        this.mask = '(##) ####-####?#
      }
    }
  }
}
</script>