vue限制输入框只能输入数字,且能有三位小数

复制代码
<el-input
              v-model="where.wirediameter"
              :placeholder="$t('info.placeholderwirediameter')"
              clearable
              @clear="where.wirediameter = undefined"
              oninput="value=value.replace(/[^\d.]/g, '')//只能输入数字
              .replace(/^(\-)*(\d+)\.(\d\d\d).*$/, '$1$2.$3')//只能输入三个小数
              .replace(/\.{2,}/g, '.')//出现多个点时只保留第一个
              .replace(/^00*(\d)([0-9]*)/g,'$1$2')// 前两位不能同时是0;"
            />
复制代码

区别:

第一种:可以输入0;

第二种:不可以输入0

<el-input
              v-model="where.wirediameter"
              :placeholder="$t('info.placeholderwirediameter')"
              clearable
              @clear="where.wirediameter = undefined"
              @input="num(where.wirediameter)"
            />
复制代码
num(amount) {
      amount = amount
        .replace(/[^\d.]/g, '')
        .replace(/^(\-)*(\d+)\.(\d\d\d).*$/, '$1$2.$3') // eslint-disable-line
        .replace(/\.{2,}/g, '.'); //只能输入数字,只能输入两个小数,出现多个点时只保留第一个
      // 第一位不让输小数点
      if (amount == '.') {
        amount = '';
      }
      // 如果第一位是0,有第二位且第二位不是小数点的情况下 就清空输入框
      if (amount.slice(0, 1) == '0') {
        if (amount.slice(1, 2)) {
          if (amount.slice(1, 2) != '.') {
            // 第二位不是小数点,清空输入框
            amount = '';
          }
        }
      }
      this.$set(this.where, 'wirediameter', amount);
    },
复制代码

 

posted @   Ao_min  阅读(387)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现
点击右上角即可分享
微信分享提示