Vue 2.0 textMask.js

import createTextMaskInputElement from '../../node_modules/text-mask-core/src/createTextMaskInputElement.js'

export default {

  // Input event callback will be stored in this variable
  // because we'll need it for unbind method
  callback: null,

  bind (el, binding, vnode) {
    // Check for empty value is good for list rendering (some inputs has no masks)
    if (!binding.value) {
      return
    }

    binding.value.inputElement = el

    const textMaskInputElement = createTextMaskInputElement(binding.value)

    // We need to update v-model
    binding.def.callback = event => {
      textMaskInputElement.update(event.target.value)

      // Trying to allocate v-model directive
      const vModel = vnode.data.directives.find(d => d.rawName === 'v-model')

      // v-model's expression stores the variable name
      // Context will be the component, so update it's v-model
      if (vModel) {
        vnode.context[vModel['expression']] = event.target.value
      } else {
        // Fix for input-components when v-model is binded to parent element
        const vModel = vnode.context.$vnode.data.directives.find(d => d.rawName === 'v-model')

        if (vModel) {
          vnode.context.$vnode.context[vModel['expression']] = event.target.value
        }
      }
    }

    el.addEventListener('input', binding.def.callback)
  },

  unbind (el, binding) {
    el.removeEventListener('input', binding.def.callback)
  }

}

export { default as conformToMask } from '../../node_modules/text-mask-core/src/conformToMask.js'