I'm trying a simple example of dynamic input formatting if input = 3 => save text, else - text old:

const [text, setText] = useState('');

return(
    
         {
                if (innerText === '3')
                    setText(innerText);
                }}
        />
    )

What happens: I enter anything, try to correct the input - I get the input blinking for a few seconds - the value that I enter from the keyboard appears for a moment, then returns to the previous state, thanks to the "filter" in onChangeText (for example, you can enter only the number 3, and when entering the rest - I actually see all the characters that I enter for some time, and only then they are erased in accordance with the value). How to avoid this?

How to avoid this? I tried a bunch of ways:

• changing onChangeText to onChange
• changing onChangeText to onKeyPress and all their combinations
• two states connected via useEffect (the first was set in value, the second was set in onChangeText, and in useEffect I equated them)
• defaultValue does not suit my tasks
• maxLength does not suit my tasks, as well as editable = false
• MaskInput has the same problem when the mask ends and you try to enter something longer than its length react-native-text-input-mask and react-native-advanced-input-mask work well for me, because they are direct wrappers over native inputs (a wrapper over a native input would be perfect for me), but in the first one my customNotations crash on Android, and in the second one if I open , then my value disappears, as if the value is empty, although I made a component next to it that duplicates the value, and the value itself is fine, it is simply reset inside the component, and if I use defaultValue, then onChangeText will be called twice, which greatly breaks the processing logic I'm desperate, what should I do with this, please tell me! I need something that will help process and replace user input BEFORE it is displayed