Блог

Главная - Вопросы по программированию - Формат валюты в евро

Формат валюты в евро

#javascript #reactjs #currency

Вопрос:

Я работаю над компонентом, который форматирует значение для отображения в разных форматах, таких как доллар и евро, с запятыми и точками. У меня есть рабочий ввод в долларах, однако мой ввод в евро не работает, и ввод не получает правильных значений, которые я ввожу, я пробовал разные решения, но не могу найти недостающую часть. Это очень минимизированная версия ссылки на компонент и изолированную среду. Заранее спасибо.

Песочница https://codesandbox.io/s/elated-sea-7328g?file=/src/App.js

 import "./styles.css";
import {useState} from "react";
export default function App() {

  const [inputValue, setInputValue] = useState("");
  const [inputUsdValue, setinputUsdValue] = useState("");

  const currencyFunction = (formatData) => { 
    return  new Intl.NumberFormat('it-IT').format(formatData)
}

const currencyFunctionDolar = (formatData) => { 
  return  new Intl.NumberFormat('en-US').format(formatData)
}
  return (
    <div className="App" style={{display: "flex", flexFlow: "column"}}>
      <h1>Test component</h1>

      <p>Euro format</p>
      <p>Euro format example {currencyFunction(123456789)}</p>
      <input 
        value={currencyFunction(inputValue)}
        onChange={e => {
                  setInputValue(e.target.value.replace(/,/g, '.').replace(/([a-zA-Z ])/g, ""))
        }} 

        style={{marginBottom: 20}}
    />
    <p>Usd format</p>
    <p>Usd format example {currencyFunctionDolar(123456789)}</p>
    <input 
        value={currencyFunctionDolar(inputUsdValue)}
        onChange={e => {
                  setinputUsdValue(e.target.value.replace(/,/g, '').replace(/([a-zA-Z ])/g, "").replace(/^0 /, ''))
        }} 
    />
    </div>
  );
}

Ответ №1:

Для вашего onChange события в валюте евро вы хотите удалить . так же, как вы удаляете , для долларов, и вы можете добиться этого следующим образом:

 setInputValue(e.target.value.replace(/[.]/g, '').replace(/([a-zA-Z ])/g, "").replace(/^0 /, ''))

Причина . заключения в скобки ( [] ) заключается в том, что это специальный символ в регулярных выражениях.

Пример рабочей изолированной среды: https://codesandbox.io/s/ecstatic-wilson-or7qd?file=/src/App.js

Комментарии:

1. Спасибо за ответ, однако, если вы попробуете это решение, входное значение возвращает NaN, когда оно получает первую точку

2. Я действительно попробовал это, и это работает: codesandbox.io/s/ecstatic-wilson-or7qd?file=/src/App.js

Метки: