鍵盤不會被 React Native 中的 Keyboard.dismiss 關閉

Question

當用戶點擊鍵盤或輸入之外的任何地方時，我希望關閉鍵盤，但是當我點擊其他地方時鍵盤不會被關閉：

        <TouchableWithoutFeedback style={styles.container} onPress={Keyboard.dismiss}>
            <View style={styles.inputContainer}>
                <TextInput
                    placeholder="Search Term"
                    style={styles.input}
                    onChangeText={setSearch}
                    value={search}
                    returnKeyType="search"
                    onSubmitEditing={handleSubmit}
                />
            </View>
        </ TouchableWithoutFeedback>

樣式非常標准：

   container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
    },
    inputContainer: {
        position: 'absolute',
        top: stackHeaderHeight + 10,
        height: height * .1,
        width: '100%',
        flexDirection: 'row',
        justifyContent: 'center',
        alignItems: 'center',
    },

Answer 1

你需要改變你的onPress代碼TouchableWithoutFeedback

<TouchableWithoutFeedback style={styles.container} onPress={()=> Keyboard.dismiss()}>

        </ TouchableWithoutFeedback>

示例工作代碼。

render() {
return (
  <TouchableWithoutFeedback onPress={()=>Keyboard.dismiss()} >
    <View style={{ flex: 1 }}>
      <TextInput returnKeyType="search" style={{borderWidth:1,borderColor:'grey',marginTop:100,height:50,marginHorizontal:50}}/>
    </View>
  </TouchableWithoutFeedback>
);
}

我認為您的樣式屬性有問題。 請檢查您的container和inputcontainer樣式屬性。 如果您的render方法中有任何ScrollView ，請添加以下內容

<ScrollView keyboardShouldPersistTaps='always'>