I created this component with react-number-format
const NumberFormatCustom = React.forwardRef(function NumberFormatCustom(
props,
ref
) {
const { onChange, ...other } = props;
return (
<NumericFormat
{...other}
getInputRef={ref}
onValueChange={(values) => {
onChange({
target: {
name: props.name,
value: values.value,
},
});
}}
maxLength={11}
allowLeadingZeros
// isNumericString
/>
);
});
and I passed it to my TextField component of MUIv5.
InputProps={{
inputComponent: NumberFormatCustom,
}}
but it doesn't work. the onChange prop of my TextField don't work at all
I tried some approaches like this :
e.target.value.replace(/[۰-۹]/g, (d) => "۰۱۲۳۴۵۶۷۸۹".indexOf(d))
but it didn't work because onChange is not working. I tried to add replace function to value part of NumericFormat but it didn't work either.
how can I handle it?