input 输入框正则只能输入整数、小数两位小数（金额）

小智学前端

已于 2023-11-06 11:06:11 修改

阅读量360

点赞数

文章标签： javascript 前端 typescript

于 2023-11-06 10:32:11 首次发布

本文链接：https://blog.csdn.net/weixin_46146740/article/details/134240892

版权

input 输入框正则只能输入整数、小数两位小数（金额）

  //template
  <el-form-item label="单价" prop="price">
       <el-input v-model="ruleForm.price" @input="formatCurrency"/>
  </el-form-item>
  //TS部分
  
const formatCurrency = () => {
    // 只允许输入数字和最多两位小数
    if (!ruleForm.value.price) return false
    // 仅允许输入数字和最多两位小数
    let formattedAmount = ruleForm.value.price.replace(/[^\d.]/g, ''); // 保留数字和小数点
    const decimalSplit = formattedAmount.split('.');
    if (decimalSplit.length === 2 && decimalSplit[1].length > 2) {
        // 如果小数位超过两位，则不允许继续输入
        formattedAmount = decimalSplit[0] + '.' + decimalSplit[1].slice(0, 2);
    }
    if (formattedAmount !== ruleForm.value.price) {
        ruleForm.value.price = formattedAmount;
    }
}