如果我点击文本输入,我希望能够点击其他地方以便再次解除键盘(尽管不是返回键)。在我阅读的所有教程和博客文章中,我都没有找到关于这一点的最细微的信息。 这个基本的例子对我来说仍然不适用于模拟器中的react-native 0.4.2。无法在我的iPhone上试用它。
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to React Native!
</Text>
<Text style={styles.instructions}>
To get started, edit index.ios.js
</Text>
<Text style={styles.instructions}>
Press Cmd+R to reload,{'\n'}
Cmd+D or shake for dev menu
</Text>
<TextInput
style={{height: 40, borderColor: 'gray', borderWidth: 1}}
onEndEditing={this.clearFocus}
/>
</View>
The problem with keyboard not dismissing gets more severe if you have
keyboardType='numeric'
, as there is no way to dismiss it.Replacing View with ScrollView is not a correct solution, as if you have multiple
textInput
s orbutton
s, tapping on them while the keyboard is up will only dismiss the keyboard.Correct way is to encapsulate View with
TouchableWithoutFeedback
and callingKeyboard.dismiss()
EDIT: You can now use
ScrollView
withkeyboardShouldPersistTaps='handled'
to only dismiss the keyboard when the tap is not handled by the children (ie. tapping on other textInputs or buttons)If you have
Change it to
or
EDIT: You can also create a Higher Order Component to dismiss the keyboard.
Simply use it like this
NOTE: the
accessible={false}
is required to make the input form continue to be accessible through VoiceOver. Visually impaired people will thank you!