英文:
Vue3 - Maska - mask to fullname input
问题
目前我正在我的Vue项目中使用maska作为掩码库。
是否有办法为fullname输入框编写一个掩码,使其接受任何字母并将空格后的第一个字母转换为大写?
英文:
Currently I'm using maska as a mask library in my vue project.
Is there anyway to write a mask to a fullname input that will accepts any letters and upercase the first letter after an space?
答案1
得分: 0
"Nevermind I've just figure it."
"Nevermind I've just figure it."
import { ref } from 'vue';
import { MaskInputOptions } from 'maska';
const maskOptions = ref({
postProcess(value: string): string {
function capitalizeFirstLetterAndFirstLettersAfterSpace(input: string): string {
return input
.toLowerCase()
.split(' ')
.map(s => s.charAt(0).toUpperCase() + s.substring(1))
.join(' ');
}
return capitalizeFirstLetterAndFirstLettersAfterSpace(value);
},
mask: '@',
eager: true,
tokens: {
'@': {
pattern: /[a-zA-ZÀ-ú ]/,
repeated: true,
},
},
} as MaskInputOptions);
const name = ref<string | undefined | null>(null);
英文:
Nevermind I've just figure it.
<template>
<VTextField
label="Full Name"
prepend-icon="mdi-account-circle-outline"
v-model="name"
v-mask:[maskOptions]
/>
</template>
import {ref} from 'vue';
import { MaskInputOptions } from 'maska';
const maskOptions = ref({
postProcess(value: string): string {
function captilizeFirstLetterAndFirstLettersAfterSpace(input: string): string {
return input
.toLowerCase()
.split(' ')
.map(s => s.charAt(0).toUpperCase() + s.substring(1))
.join(' ');
}
return captilizeFirstLetterAndFirstLettersAfterSpace(value);
},
mask: '@',
eager: true,
tokens: {
'@': {
pattern: /[a-zA-ZÀ-ú ]/,
repeated: true,
},
},
} as MaskInputOptions);
const name = ref<string|undefined|null>(null);
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论