Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

101
Visualizações
Vue js 3 + vue-phone-number-input

I tried to install this dependency but every time i've told that it's not existing and vue 3 cannot relove it component .

https://www.npmjs.com/package/vue-phone-number-input

thank you for helping me enter image description here

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

Try the following

Open App.vue file and add the following to it:

<template>
<div id="app">
<div class="container">
  <VuePhoneNumberInput
    id="phoneNumber1"
    v-model="phoneNumber"
    color="dodgerblue"
    :dark="dark"
    :disabled="disabled"
    :ignored-countries="countriesIgnored"
    :preferred-countries="countriesList"
    :loader="hasLoaderActive"
    clearable
    :error="hasErrorActive"
    class="mb-2"
    @update="onUpdate"
  />
  <b>v-model</b> : {{ phoneNumber }}
</div>
</div>
</template>
<script>
import VuePhoneNumberInput from "vue-phone-number-input";
export default {
name: "App",
components: {
  VuePhoneNumberInput,
},
data() {
  return {
    phoneNumber: null,
    defaultCountry: "FR",
    countriesList: ["FR", "BE", "DE"],
    countriesIgnored: ["AF", "AD", "AL"],
    dark: false,
    disabled: false,
    hasLoaderActive: false,
    hasErrorActive: false,
   };
 },
methods: {
 onUpdate(payload) {
   this.results = payload;
 },
},
};
</script>
<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
 }
</style>

Then, Open the main.js file and add the following to it:

import Vue from 'vue'
import App from './App.vue'
import 'vue-phone-number-input/dist/vue-phone-number-input.css';
Vue.config.productionTip = false
new Vue({
render: h => h(App),
}).$mount('#app')

Hope this works!

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda