I have an autocomplete screen where the very top is a textInput
and below it is a list of autocompletes that are touchable. However, when the keyboard is up, I have to touch the autocompletes twice: the first time to dismiss the keyboard, and the second time to actually touch the autocomplete. How can I achieve the above with one touch.

- 967
- 5
- 17
- 36
-
I am not sure whether you have used scroll view or not, but you may look into this thread https://github.com/facebook/react-native/issues/12784, – Prasun Mar 23 '18 at 03:33
2 Answers
Below the textInput
where you have the list which shows all the autocompletes, usually a ScrollView
just add this attribute to it keyboardShouldPersistTaps='handled'
It should look like this :
<ScrollView keyboardShouldPersistTaps='handled'>
{autoCompletes}
</ScrollView>
The attribute keyboardShouldPersistTaps
tells the app not to close the keyboard instead let the touch handler handle it, hence the keyboards persists its state.
Refer this post for more details :: Ignore rest of screen when keyboard active

- 11
- 2
keyboardShouldPersistTaps='handled'
or keyboardShouldPersistTaps='always'
is the answer for your problem.
Note: All scrollable view present within the main parent scroll view should have this attribute keyboardShouldPersistTaps='handled'
Note: Flatlist is also scrollview so Flatlist also consider attribute keyboardShouldPersistTaps='handled'

- 7,322
- 2
- 39
- 55

- 1,269
- 15
- 15