react-native - 如何在 react-native 中设置 Onpress On Textinput

Question

我正在开发一个关于本机反应的应用程序。我想在按下文本输入时调用日期选择器，并在选择应显示在文本输入上的日期后

Answer 1

包装TextInput成一个视图并设置pointerEvents为none. 现在您可以使用Pressable组件 fromreact-native来监听onpress事件。

<Pressable onPress={() => alert('Hi!')}>
 <View pointerEvents="none">
  <TextInput />
 </View>
</Pressable>

Answer 2

您不能明确onPress要求TextInput. 你只能用。onFocus当您按下输入框以将光标移到那里时将调用它。无需关注 onBlur，因为您的用例不需要。. onFocus如果可能，在内部处理。

onFocus = () => {
  // do something
}

render() {
  <TextInput onFocus={onFocus} />
}

Answer 3

你要做的是使用 TextInput 的 onFocus 和 onBlur。

<TextInput 
    onFocus={this.onFocus}
    onBlur={this.onBlur}
/>

onFocus = () => {
 // Open date picker
}

onBlur = () => {
 // Close date picker and add value to textinput
}

Answer 4

您可以通过提供使文本输入字段只读

 editable={false}
 pointerEvents="none"

支持 TextInput。