regex InputNumber फॉर्मेटर एंटी-डिज़ाइन
दोस्तों मैं वास्तव में रेगेक्स के बारे में नहीं समझता, मैं एक मुद्रा फ़िल्टर बनाने के लिए एंटी-डिज़ाइन इनपुट नंबर घटक का उपयोग कर रहा हूं।
वर्तमान में यह इस प्रकार है:
<InputNumber
style={{ width: 175 }}
formatter={value => `R$ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g,
".")}
parser={value => value.replace(/[A-Z]|[a-z]|[$ ]|\.+/g, "")}
onChange={(value) => setSelectedKeys(value ? value : [])}
/>
वर्तमान प्रारूप, छूट हजार पांच सौ के लिए इस तरह है: 1.500 मुझे इसे स्वीकार करने की आवश्यकता है, नकारात्मक संख्या (-1.500) और सेंट के लिए अल्पविराम जैसे 1.500,25
क्या आप लोग मेरी सहायता कर सकते हैं ? मैंने कुछ समाधानों की कोशिश की है, लेकिन मुझे आवश्यकतानुसार काम नहीं कर सकता
जवाब
1 GiuliaLage
बहुत खोज करने के बाद दोस्तों, मैंने एक उपाय खोजा, वह बेहतर नहीं हो सकता, लेकिन फिलहाल वह अपना काम कर रहा है।
मैंने MaskedInput और text-mask-addons निर्भरताएँ स्थापित की हैं।
import MaskedInput from "react-text-mask";
import createNumberMask from "text-mask-addons/dist/createNumberMask";
const defaultMaskOptions = {
prefix: "R$",
suffix: "",
includeThousandsSeparator: true,
thousandsSeparatorSymbol: ".",
allowDecimal: true,
decimalSymbol: ",",
decimalLimit: 2,
integerLimit: 7,
allowNegative: true,
allowLeadingZeroes: false,
};
const currencyMask = createNumberMask(defaultMaskOptions);
const NumberFilter = (
<Space style={{ marginRight: 20 }}>
<MaskedInput
mask={currencyMask}
render={(ref, props) => (
<Input
placeholder="Valor inicial"
ref={(input) => ref(input && input.input)}
{...props}
value={selectedKeys[0]}
onChange={(event) => {
props.onChange(event);
let betweenInitial = [...selectedKeys];
betweenInitial[0] = event.target.value;
setSelectedKeys(betweenInitial);
}}
/>
)}
/>
<RiArrowLeftRightLine />
<MaskedInput
mask={currencyMask}
render={(ref, props) => (
<Input
placeholder="Valor final"
ref={(input) => ref(input && input.input)}
{...props}
value={selectedKeys[1]}
onChange={(event) => {
props.onChange(event);
let betweenFinal = [...selectedKeys];
betweenFinal[1] = event.target.value;
setSelectedKeys(betweenFinal);
}}
/>
)}
/>
</Space>
);