vue3 输入框支持输入两位小数 支持负数

<template>
   <van-field v-model="number" type="number" @input="onInput" />
</template>
<script setup>
  const onInput = (event) => {
        var input = event.target;
        var value = input.value;

        value = value.replace(/[^\d.-]/g, ""); //清除"数字"和"."和-以外的字符
        value = value.replace(/^\./g, ""); //验证第一个字符是数字或者负号而不是.
        value = value.replace(/\.{2,}/g, "."); //只保留第一个.清除多余的
        let isF = false;
        if (value.substring(0, 1) === '-') {
          // 是负数,做个标记
          isF = true;
        }
        // 把所有负号先删除
        value = value.replace(/-/g, "");
        value = value
          .replace(".", "$#$")
          .replace(/\./g, "")
          .replace("$#$", ".");

        value = value.replace(/^(\\-)*(\d+)\.(\d\d).*$/, "$1$2.$3"); //只能输入两个小数
        if (isF) { // 删除后面其他负号
          value = '-' + value;
        }

        // 更新输入框的值
        input.value = value;
      }
</script>

参考地址:https://blog.csdn.net/m0_46156566/article/details/131410369

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容