vue input框只能输入数字、小数点并限制长度

今天在写代码时遇到一些问题，input的type属性值为number时，maxlength的设置会失效，type属性值为text时，又无法满足input只能输入数字的限制，找到的解决方法如下：

1、只能输入数字和小数点

@keyup="val.num = val.num.replace(/[^\d.]/g,'')"

具体内容：

<form v-for="(val,index) in list" :key='val.id'>
	<input 
	 type = "text"
	 placeholder = "请输入数量"
	 v-model = "val.num"
	 maxlength = "7"
	 @keyup = "val.num = val.num.replace(/[^\d.]/g,'')"
	/>
form>

2、只能输入一个小数点，当第二位不是'.'时，首位不能为0

2.1 限制一个小数点

val.num= val.num
   .toString().//replace()方法是字符串方法
   .replace(/\.{2,}/g,'.')
   .replace('.','$#$')
   .replace(/\./g,'')
   .replace('$#$','.')//只能输入一个小数点

2.2 首位不能为0

if(val.num.length > 1 && val.num.substr(0,1) ==0 && val.num.substr(1,1) !='.'){
    val.num= val.num.substr(1,1)
}

2.3、首位不为点
方法一：

if(val.num.substr(0,1) == '.'){
    val.num=""
}

方法二：

if(val.num.indexOf(".") <= 0 && val.num!= ''){
   val.num= parseFloat(val.num)
}

2.4、限制小数点的位数（3位为例）

val.num= val.num
   .toString()
   .replace(/^()*(\d+)\.(\.?\d\d\d).*$/,'$2$2.$3')
                           //d有几个就是几位小数