Use as a custom field of vue-form-generator

Check out the setup in CodeSandbox.

• Add a component using vue-form-generator's abstractField mixin

  <!-- tel-input.vue -->
  <template>
    <vue-tel-input v-model="value"></vue-tel-input>
  </template>
  
  <script>
    import { abstractField } from 'vue-form-generator';
  
    export default {
      name: 'TelephoneInput',
      mixins: [abstractField],
    };
  </script>

• Register the new field as a global component

  import Vue from 'vue';
  import TelInput from '<path>/tel-input.vue';
  
  Vue.component('field-tel-input', TelInput);

• Now it can be used as tel-input in schema of vue-form-generator

  var schema: {
    fields: [
      {
        type: 'tel-input',
        label: 'Awesome (tel input)',
        model: 'telephone',
      },
    ],
  };

  Read more on vue-form-generator's instruction page