Форматирование валюты в React / Javascript

Question

Добрый день, ребята!

Я использую React NumberFormat для форматирования валюты, она работает хорошо, но я не могу воспроизвести с ней поведение, которое я хочу для своей страницы.

I хотел бы, чтобы пользователь набрал ввод 1010, и этот ввод автоматически исправляет его до 10,10 долл.

Однако все найденные мной методы, когда пользователь вводит 1010, исправляют его на 1010,00 долл.

Как мне получить это поведение в реальном времени на входе? Как только пользователь печатает, он уже форматирует.

Оцените!

Мне нужно регулярное выражение или код, где:

Я печатаю - код возврата

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

Answer 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'

Таким образом, вы всегда получаете последние два символа справа от десятичной точки, как вы пытаетесь это сделать, и используя локализацию для правильного форматирования числа.