我正在开发一个本机应用程序。我在其中使用日期时间选择器。我的问题是我想在选择日期和时间后立即在textInput中显示从日期时间选择器中选择的日期和时间...该怎么做。这是我的代码
import React from 'react';
import { StyleSheet, Text, View, TextInput } from 'react-native';
import DateTimePicker from 'react-native-modal-datetime-picker';
export default class App extends React.Component {
constructor(props){
super(props)
this.state=({
isDateTimePickerVisible: false,
selecteddate:''
})
}
_showDateTimePicker = () => this.setState({ isDateTimePickerVisible: true });
_hideDateTimePicker = () => this.setState({ isDateTimePickerVisible: false });
_handleDatePicked = (pickeddate) => {
day = pickeddate.getDate();
month = pickeddate.getMonth();
year = pickeddate.getFullYear();
console.log('A date has been picked: ' + day + '-' + month + '-' + year);
exdate= day + '-' + month + '-' + year
this._hideDateTimePicker();
};
onFocus = () => {
this._handleDatePicked();
}
render() {
return (
<View style={styles.container}>
<Text>Open up App.js to start working on your app!</Text>
<TextInput
placeholder="placeholder..."
onFocus={ () => this._showDateTimePicker() }
value={this.state.selecteddate}
/>
{/* //--------------------------------------DateTimePicker */}
<DateTimePicker
isVisible={this.state.isDateTimePickerVisible}
onConfirm={this._handleDatePicked}
onCancel={this._hideDateTimePicker}
mode={'date'}
datePickerModeAndroid={'spinner'}
/>
{/* //-------------------------------------- */}
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});
答案 0 :(得分:1)
您只是忘了在_handleDatePicked方法中添加设置状态!!
_handleDatePicked = (pickeddate) => {
day = pickeddate.getDate();
month = pickeddate.getMonth();
year = pickeddate.getFullYear();
console.log('A date has been picked: ' + day + '-' + month + '-' + year);
exdate= day + '-' + month + '-' + year
this.setState({selecteddate : day + '-' + month + '-' + year})
this._hideDateTimePicker();
};
答案 1 :(得分:1)
您必须在_handleDatePicked()中设置所选状态
_handleDatePicked = (pickeddate) => {
+ this.setState({selecteddate : day + '-' + month + '-' + year})
}
你很好!