React-Native：'onBlur' 在触及 TextInput 的一侧时不会被触发

Question

   <TextInput
        ref={ ref => this.mobileNumberRef = ref}
        keyboardType='phone-pad'
        returnKeyType='done'
        onBlur={() => Keyboard.dismiss()}
   />

我想在 TextInput 区域外触摸时关闭键盘。但是 onBlur() 并没有被解雇。

有人可以告诉我如何实现吗？谢谢你！

Answer 1

onBlur 当 Input 失去焦点时发生。

Keyboard.Dismiss 关闭活动键盘并移除焦点。

通过触摸 TextInput 的外部，您无论如何都会失去元素的焦点，所以我不确定您为什么还需要 Keyboard.Dimiss。

我也在沙盒上测试过这个，对我来说它工作正常。也许你可以分享更多代码并准确解释你想要实现什么？

最后请检查也许这会帮助您解决问题。

Answer 2

首先 onBlur 当文本输入模糊时调用。但是如果你想在触摸到下面场景中使用的 TextInput 区域之外时关闭键盘

<ScrollView keyboardShouldPersistTaps="handled">
  <TextInput
    onChangeText={this.onChangeText}
    keyboardType="phone-pad"
    returnKeyType="done"
  />
</ScrollView>

或

<TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
  <View style={{ flex: 1, backgroundColor: "#fff" }}>
    <TextInput
      onChangeText={this.onChangeText}
      keyboardType="phone-pad"
      returnKeyType="done"
    />
  </View>
</TouchableWithoutFeedback>

希望对您有所帮助。有疑问欢迎留言。

React-Native：'onBlur' 在触及 TextInput 的一侧时不会被触发

React-Native: 'onBlur' is not getting fired when touched out side of the TextInput

onblur

react-native