Как настроить Onpress On Textinput в реагирующем

Question

Я разрабатываю приложение на реагировать родной. Я хочу вызвать средство выбора даты, когда нажимаю на ввод текста и после выбора даты оно должно отображаться на вводе текста

Answer 1

Вы не можете явно позвонить onPress за TextInput, Вы могли только использовать. onFocus который будет вызван, когда вы нажмете поле ввода, чтобы навести курсор туда. Не нужно фокусироваться на onBlur, так как ваш вариант использования не требуется., Ручка закрыта внутри onFocus если возможно.

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

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

Answer 2

Заворачивать TextInput в поле зрения и установить pointerEvents в виде none. Теперь вы можете использовать Pressable компонент из react-native слушать onpress событие.

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

Answer 3

Что вам нужно сделать, это использовать onFocus и onBlur из TextInput.

<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"

prop в TextInput.

Answer 5

Оберните TextInput внутри представления и установите pointerEvents="none", оберните это представление с помощью TouchableOpacity или любого другого сенсорного компонента. Пожалуйста, смотрите пример ниже!

      <TouchableOpacity
  onPress={() => {
                    alert('hello');
                }}>
                <View pointerEvents="none">
                    <TextInput
                        onChange={() => {}}
                        value={''}
                        placeholder={waterMark}
                        editable={!isDisabled}
                        selectTextOnFocus={!isDisabled}
                    />
                </View>
</TouchableOpacity>