React / Javascript 中的货币格式答案

【问题标题】：Currency formatting in React / JavascriptReact / Javascript 中的货币格式
【发布时间】：2020-02-27 17:21:53
【问题描述】：

大家下午好！

我正在使用 React NumberFormat 进行货币格式化，它运行良好，但我无法用它重现我想要的页面行为。

我希望用户输入 1010 输入，输入自动将其更正为 $10.10。

但是，我找到的所有方法，当用户输入 1010 时，他将其更正为 $1010.00。

如何在输入中实时获得这种行为？一旦用户输入，它就已经在格式化了。

欣赏！

我需要一个正则表达式或代码，其中：

我输入 - 返回码

1010 ===> 10.10
1000 ====> 10.00
1050 =====> 10.50
100050 ====> 1,000.50

【问题讨论】：

欢迎来到 SO！请添加您最好的不工作尝试！
所以分割并格式化....var str = '1010'; console.log((Number(str)/100).toLocaleString('de-DE', { style: 'currency', currency: 'USD' }));
我要试试这个...谢谢！
我需要一个正则表达式或代码，其中：我输入 ===> 返回代码 1010 ===> 10.10 1000 ====> 10.00 1050 =====> 10.50 100050 == ==> 1,000.50
根据您的要求，这个反应包会更好地工作 - github.com/ianmcnally/react-currency-masked-input。

标签： javascript reactjs input

【解决方案1】：

您可以尝试制作如下“格式”功能：

function formatCurrency(currencyString) {   
    let firstHalf = currencyString.substring(0, currencyString.length - 2);
    let secondHalf = currencyString.substring(currencyString.length - 2, currencyString.length);
    return parseFloat(`${firstHalf}.${secondHalf}`).toLocaleString('en-EN', {style: 'currency', currency: 'USD'});
}

// example use case: 
let cur = formatCurrency('1010'); // returns: '$10.10'
cur = formatCurrency('101010') // returns: '$1,010.10'

这样，您总是可以得到小数点右侧的最后两个字符，就像您尝试做的那样，并使用本地化来正确格式化数字。

【讨论】：