在项目里遇到input框只能输入数字,且只能有两位小数的需求,记录一下:
image.png
<el-table-column label="金额" prop="amt" width="120" align="right">
<template slot-scope="scope">
<el-input v-model="scope.row.amt" placeholder="请输入" v-if="scope.row.editable" @input="num(scope.$index, scope.row.amt)"></el-input>
<span v-else>{{scope.row.amt}}</span>
</template>
</el-table-column>
// 发票金额只能是数字 只保留两位小数
num(index, value){
value = value.replace(/[^\d.]/g,""); //清除"数字"和"."以外的字符
value = value.replace(/^\./g,""); //验证第一个字符是数字
value = value.replace(/\.{2,}/g,"."); //只保留第一个点, 清除多余的
value = value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
value = value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3'); //控制可输入的小数(\d的个数就是要保留的位数)
this.tableData[index].amt = value
},
(ps:上面的方法我是之前百度的,但是现在找不到是哪篇文章了,如果作者大大看到了请联系我加上你的原文链接啊,对不起对不起不是有意的)
或者直接:
num(index, value){
value = (value.match(/^\d*(\.?\d{0,2})/g)[0]) || null;//两位小数
this.tableData[index].amt = value
},
啊我前几天看的正则是又学到狗肚子里了吗怎么还是看不懂!!!!
