整数带有千位分割符，小数不带千位分割符

在使用Ant Design组件库中的InputNumber组件时，数字较长的情况下，可以使显示的数字加上千位分隔符。但是当遇到需要展示较长小数的情况下，有千分符看着会有一丢丢的乱，可能会看看错小数点。

解决方法：可以使用 formatter 和 parser 属性来实现输入一个数字，整数部分带有千位分割符，小数部分不带有千位分割符的效果。解决前后效果图如下：

改造前的代码：

<InputNumber
          defaultValue={1000}
          style={{ width: 300 }}
          formatter={(value) =>
            `$ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')
          }
          parser={(value) => value.replace(/\$\s?|(,*)/g, '')}
        />

改造后的代码：

<InputNumber
  formatter={value => {
    const [int, dec] = `${value}`.split('.');
    const intStr = int.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
    return dec ? `$ ${intStr}.${dec}` : `$ ${intStr}`;
  }}
  parser={value => value.replace(/\$\s?|(,*)/g, '')}
/>

formatter 属性：指定输入框展示值的格式，处理将输入值按小数点拆分成整数部分和小数部分，整数部分使用正则表达式在数字的千位之间添加了一个逗号，小数部分不做处理。
parser 属性：指定从 formatter 里转换回数字的方式，和 formatter 搭配使用，中的函数将输入的值中的逗号字符替换为空字符串。