Показать дату выбора в текстовом поле в реагировать родной

Question

Показать дату выбора в текстовом поле в реагировать родной

1

Я использую action-native-datepicker для отображения выбора даты. Моя проблема: у меня есть два текстовых поля для даты начала и окончания. Я хочу показать выбор даты, когда пользователь коснется текстового поля. С этим кодом его показывание выбора даты, но я хочу, чтобы сборщик показывался, когда пользователь нажимает на текстовое поле. И выбранная дата должна быть привязана к текстовому полю.

    <DatePicker
    style={{width: 200}}
    date={this.state.date}
    mode="date"
    placeholder="Select date"
    format="YYYY-MM-DD"
    minDate="2016-05-01"
    maxDate="2020-12-12"
    confirmBtnText="OK"
    cancelBtnText="Cancel"
    onDateChange={(date) => {this.setState({date: date})}}

Как я могу это достичь? Anyhelp можно оценить. Заранее спасибо!!!

Ashrith K S 19 июнь 2017, в 14:11

Источник

Теги:

javascript

react-native

ios

2 ответа

Ещё вопросы

Arunkumar · Answer 1 · 2017-06-19T10-35-00.000Z

Попробуйте приведенный ниже код

функция

_showDateTimePicker = () => this.setState({ isDateTimePickerVisible: true });

_hideDateTimePicker = () => this.setState({ isDateTimePickerVisible: false });

_handleDatePicked = date => {
    var dobValue='Select Date of Birth';
    var date = new Date(date);
    if (! isNaN(date)) {
        this.setState({ dob: date });
    }
    this._hideDateTimePicker();

оказывать

var dobValue='Select Date of Birth';

var date = new Date(this.state.dob);
dobValue= isNaN(date) ? this.state.dob :date.getDate() + "/"+ parseInt(date.getMonth()+1) +"/"+ date.getFullYear();


<DateTimePicker isVisible={this.state.isDateTimePickerVisible} onConfirm={this._handleDatePicked} onCancel={this._hideDateTimePicker}/>

<Input style={{fontSize:16,padding:6,borderColor:'#C8C8C8',borderWidth: 1}} placeholder="Email" onChangeText={this._showDateTimePicker} value={dobValue}/>

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

Ashrith K S · Answer 2 · 2017-06-19T10-28-00.000Z

Добавьте ref в datepicker,

 <DatePicker
    style={{width: 200}}
    ref='datepicker'
    date={this.state.date}
    mode="date"
    placeholder="Select date"
    format="YYYY-MM-DD"
    minDate="2016-05-01"
    maxDate="2020-12-12"
    confirmBtnText="OK"
    cancelBtnText="Cancel"
    onDateChange={(date) => {this.setState({date: date})}}

onTap текстового вызова this.refs.datepicker.onPressDate();