欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

vue输入框只允许输入规定类型的格式,其他字符不允许输入

程序员文章站 2022-06-14 20:16:12
...
<template>
	<div>
		<input @input="formatValue(value)" v-model="value">
	</div>
</template>

<script>
	export default = {
		data(){
			return {
				value: ""
			}
		},
		methods:{
			// 只允许输入数字
			formatValue(val){
				val = this.value.replace(/[^\d]/g, "");
                this.value = val;
			},
			// 只允许输入金额类型,并且是两位小数
			formatValue(val){
				val = val.replace(/(^\s*)|(\s*$)/g, "");
                if (!val) return this.value = "";
                val = val.replace(/[^\d.]/g, "");
                val = val.replace(/^\./g, "");
                val = val
                    .replace(".", "$#$")
                    .replace(/\./g, "")
                    .replace("$#$", ".");
                val = val.replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3");
                this.value = val;
			},
		}
	}
</script>