README-pt.md

🔡 Vue input mask

Biblioteca enxuta baseado no text-mask-core (~5kb) apenas diretiva. sem dependências.

English | Português

🎨 Playground na Web

• https://codesandbox.io/s/m3q1m5yp9x ( playground interativo com webpack e ESM)
• https://jsfiddle.net/probil/c6fjjzn6/ ( playground interativo simples com UMD)
• https://v-mask-demo.netlify.com/ ( Demo v-mask )

✔️ Navegadores suportados

74+ ✔️	66+ ✔️	12+ ✔️	46+ ✔️	17+ ✔️	11+ ✔️	12+ ✔️	67+ ✔️	8.2+ ✔️

Suportamos apenas navegadores com estatísticas de uso global superiores a 1%, última versão 2 de cada navegador, mas não navegadores inativos. A biblioteca pode funcionar em navegadores antigos, mas não garantimos isso. Você pode precisar de polyfills adicionais para fazê-lo funcionar.

💿 Instalação

Esta versão requer o Vue 2.X. Se você está utilizando o Vue 1.X clique aqui.

npm install v-mask

Inicialização

ES2015 (Webpack/Rollup/Browserify/etc)

import Vue from 'vue'

// usar o plugin
import VueMask from 'v-mask'
Vue.use(VueMask);

// usar a diretiva
import { VueMaskDirective } from 'v-mask'
Vue.directive('mask', VueMaskDirective);

// usar apenas o filtro
import { VueMaskFilter } from 'v-mask'
Vue.filter('VMask', VueMaskFilter)

UMD (Browser)

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/v-mask/dist/v-mask.min.js"></script>
<script>
// usar o plugin
Vue.use(VueMask.VueMaskPlugin);

// usar a diretiva
Vue.directive('mask', VueMask.VueMaskDirective);
</script>

🚀 Utilizando

<input type="text" v-mask="'####-##'" v-model="myInputModel">
<!-- OU -->
<input type="text" v-mask="nameOfVariableWithMask" v-model="myInputModel">

Notice: v-model é necessário a partir da versão v1.1.0, porque acabam existindo muitos bugs com ouvintes de eventos HTMLElement e sincronização dos mesmos com o Vue.

Não há razão para suportar o uso dessa lib para uso sem o modelo v-model, mas abra a porta para uso em inputs personalizados.

Utilizando o filtro

<span>{{ '9999999999' | VMask('(###) ###-####') }}</span>

⚙️ Configurações

Lista de simbolos reservados para máscara:

Value	Format
#	Números (0-9)
A	Caractere de qualquer case (a-z,A-Z)
N	Caractere ou Números
X	Qualquer símbolo
?	Opcional (próximo caractere)

💉 Tests

Jest é usado para fazer os testes-unitários

Testes unitários podem ser executados utilizando o seguinte comando:

npm test

TestCafe é usando para fazer testes E2E.

E2E-tests podem ser executados utilizando o seguinte comando:

npm test:e2e

⚓ Versionamento Semântico

Este plugin segue semantic versioning.

📰 Changelog

Estamos usando GitHub Releases.

🍻 Contribuições

Estamos muito felizes em ver contribuições em potencial, então não hesite. Se você tiver alguma sugestão, ideia ou problema, sinta-se à vontade para adicionar um novo issue, mas primeiro verifique se a sua pergunta não repete as anteriores.

Aviso: Você deve fazer suas alterações apenas na pasta src, não tente editar arquivos do dist, pois ele foi compilado a partir do src a partir do babel e não deve ser alterado manualmente.

🔒 Licença

Consulte o arquivo LICENSE para obter os direitos e limitações da licença (MIT).