I have an input field on a modal, but it cant blur on button click so it takes 2x tap to press the button.
I tried Keyboard.dismiss
and useRef
both are not working.
I also tried onSubmitEditing
prop is not working either
My modal component looks like this.
<Overlay
isVisible={isModalOpen}
fullScreen={false}
animationType="slide"
overlayStyle={{width:widthModal}}
>
<ScrollView showsVerticalScrollIndicator={false} keyboardShouldPersistTaps='handled'>
<View>
<Text>{dataModal.name}</Text>
<Input
ref={inputRef}
value={dataModal.input}
onChangeText={(value) => onTempDataChange(value)}
onSubmitEditing={Keyboard.dismiss}
onEndEditing={Keyboard.dismiss}
autoFocus
blurOnSubmit
/>
</View>
<View>
<View>
<Button
title="Save"
onPress={() => {
inputRef.current.blur();
Keyboard.dismiss
onSubmit()
}}
/>
</View>
</View>
</ScrollView>
</Overlay>
Any ideas whats wrong?