似乎vue-tel-input提供了一个country-changed事件。根据文档，它甚至是第一次被触发，并返回一个对象：

Object {
   areaCodes: null,dialCode: "31",iso2: "NL",name: "Netherlands (Nederland)",priority: 0
}

因此，可以像添加电话值一样，将此事件处理程序添加到组件中，并将国家/地区代码存储在组件中。

HTML部分

<div id="app">
  <v-app id="inspire">
    <v-form>
      <v-container>
        <v-row>        
          <v-col cols="12" sm="6" md="3">
            <vue-tel-input v-model="phone" v-on:country-changed="countryChanged"></vue-tel-input>
          </v-col>
        </v-row>
      </v-container>
      <v-btn
        color="success"
        @click="submit"
      >
        submit
      </v-btn>
    </v-form>
  </v-app>
</div>

JS部分

new Vue({
  el: '#app',vuetify: new Vuetify(),data() {
    return {
      phone: null,country: null
    }
  },methods: {
    countryChanged(country) {
      this.country = country.dialCode
    },submit() {
      console.log(this.phone);
      console.log(this.country);
    }
  }
});

在这里您可以看到工作版本： https://codepen.io/otuzel/pen/PooBoQW?editors=1011

注意：我不是每天都使用Vue，因此我不确定这是否是通过事件处理程序修改数据的最佳实践。

<vue-tel-input v-model="phone" v-bind="bindProps"></vue-tel-input>

data() {
  return {
    phone: null,bindProps:{
      mode: 'international'
    }
  }
}

在vue-tel-input@3.1.1中可以通过设置道具mode: 'international'来实现，在这种情况下，电话号码将始终转换为+123 123 123 ...