react-number-format - why change inputValue with not changed value and stopPropagation

717 Views Asked by At

I use NumericFormat component (react-number-format)) with mui TextField. I want stop changing value if value.length > 20 but value changed in input when I stop changing in onChange callback (and not changed in my state). My code

        <FormControl className='idea-edit-form__field' fullWidth>
                                <NumericFormat
                                    fullWidth
                                    label='Сумма экономического эффекта'
                                    placeholder='Укажите общую сумму предполагаемого экономического эффекта'
                                    id='economicEffectSum'
                                    value={formFields.economicEffectSum}
                                    customInput={TextField}
                                    thousandSeparator={' '}
                                    onChange={(event)=>{
                                        if (event?.target?.value?.length <= 20) onChangeInput(event)
                                        else setEconomicSumError('Максимальное 
                                           количество символов - 20');      
                                        event.stopPropagation();
                                        event.preventDefault();}}
                                    onValueChange={() => {}}
                                    InputLabelProps={{ shrink: true }}
                                    InputProps={{
                                        endAdornment: <InputAdornment position='end'>руб.</InputAdornment>,
                                        inputProps: { min: 0, max: 20 },
                                    }}
                                    error={!!economicSumError?.length}
                                    helperText={!!economicSumError?.length && economicSumError}
                                />
                            </FormControl>

I try use inputValue, but it not work. If I use const value and empty callback function (()=>{}) for onChange, value in input changed anyway.
How can I stop it?

0

There are 0 best solutions below