货币格式为欧元

Question

我正在制作一个组件，该组件将值以不同的格式呈现，例如用逗号和点表示美元和欧元。我有一个工作美元输入，但是我的欧元输入不起作用，输入没有得到我输入的正确值，我尝试了不同的解决方案，但无法找出缺失的部分。这是组件和沙盒链接的最小化版本。提前谢谢。

沙箱https://codesandbox.io/s/elated -海- 7328 g?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>
);
}

Answer 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