iView的Input完整版的添加千位符和人民币符号

环境是Vue2+TS，话不多说上代码。

效果图：

首先是视图部分

<Input
              @on-change="(value) => handleChange(value, 'occupyNotionalAmount')"
              :maxlength="21"
              v-model.number="newForm1.occupyNotionalAmount"
            />

TS部分

// @ts-ignore
  public handleChange(e: any, name: any) {
    let value = e.target.value;
    value = value.replace(/,/g, '');
    value = value.replace('¥', '');

    var reg = /[^\d.]/g;
    // 只能是数字和小数点，不能是其他输入
    value = value.replace(reg, '');
    // 保证第一位只能是数字，不能是点
    value = value.replace(/^\./g, '');
    // 小数只能出现1位
    value = value.replace('.', '$#$').replace(/\./g, '').replace('$#$', '.');
    // 小数点后面保留2位
    value = value.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3');
    // this.newForm1[name]=value

    if (!value) return 0;
    // 获取整数部分
    const intPart = Math.trunc(value);
    // 整数部分处理，增加,
    const intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,');
    // 预定义小数部分
    let floatPart = '';
    // 将数值截取为小数部分和整数部分
    const valueArray = value.toString().split('.');
    if (valueArray.length === 2) {
      // 有小数部分
      floatPart = valueArray[1].toString(); // 取得小数部分
      this.$nextTick(() => {
        // @ts-ignore
        this.newForm1[name] = '¥' + intPartFormat + '.' + floatPart;
      });
    } else {
      this.$nextTick(() => {
        // @ts-ignore
        this.newForm1[name] = '¥' + intPartFormat + floatPart;
      });
    }
  }

这边是用的Input触发事件，里面加了很多正则判断，有需要的可以自行添加或修改。作者做出这个花了不少时间啊，希望能点个小推荐谢谢！