Open rswlkr opened 4 years ago
Could you include an example that uses customInput
over our current solution?
<NumberFormat
customInput={TextField}
thousandSeparator={true}
prefix={'£'}
id='minValue'
label='Minimum Value'
onChange={handleChange}
value={minValue}
className={classes.formControl}
inputProps={{
name: 'minValue'
}}
/>
https://github.com/s-yadav/react-number-format#custom-inputs
I wonder about the best option we have here. In which order should we compose the two components? NumberFormat > TextField as in the above example requires less code. I wonder about the implication it can have with the MaskedInput example. I also wonder about the forms libraries integrations.
The codebase I'm working on was having issues with using the recommended way in the MUI docs. Ended up using the above suggested method with NumberFormat
and customInput={TextField}
prop and that fixed the issues we were having.
Unfortunately we were not able to reproduce the issue in a codesandbox with our setup, so hard saying what it was about the MUI-suggested way but something was definitely messing it up from within the TextField component.
react-number-format has a customInput prop that allows passing materialui components. A custom implementation of the input component is therefore not required and the docs/examples should be updated to reflect this.