需求是输入框输入只能输入5位数并且保留两位小数,最大不超过99999,好久没有写过前端,一个方法连搜带问写了两个小时,记录一下

输入框

<input
                v-model="xxxxxx"
                type="text"
                @input="valueChange"
              />

方法

const valueChange = (e : any) => {
    console.log('=====', e.detail.value);
    let value = e.detail.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');
    if (value.length > 8) {
      value = value.substring(0, 8);
    }
    if (value > 99999) {
      value = '99999';
    }
    setTimeout(() => {
      xxxx = value;
    });
}

记得加上setTimeout 不然可能页面和变量的值不同步显示.