Menu
How to know when the focus is lost in a react native textInput?
For example I want to do an action when the user touches outside the textInput and it loses focus.
581
To check if an input field has focus with JavaScript, we can use the document. activeElement property to get the element in focus. to add an input. to check if the input element is focused.
To check if an element is focused in React:Set the ref prop on the element. After the element is rendered, check if the element is the active element in the document. If it is, the element is focused.
To unfocus a TextInput in React Native, we can use the Keyboard. dismiss method. to set the onSubmitEditing prop to Keyboard. dismiss .
it is because you are rendering the form in a function inside render(). Every time your state/prop change, the function returns a new form. it caused you to lose focus.
use the onBlur prop on TextInput
example
<TextInput onFocus={() =>console.log("focus received" ) } onBlur={() => console.log("focus lost") } /> Docs
176
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
