React Native
React Native – Date Picker

In this tutorial we are going to see how we use React Native Date Picker in our application. For this we use DatePicker Component from react-native-datepicker
library. So lets first install the dependency and after we write our App.js code.
npm install react-native-datepicker --save
App.js Code
export default class App extends Component {
constructor(props){
super(props)
this.state = {date:"24-05-2020"}
}
render(){
return (
<View style={styles.container}>
<DatePicker
style={{width: 200}}
date={this.state.date} //initial date from state
mode="date" //The enum of date, datetime and time
placeholder="select date"
format="DD-MM-YYYY"
minDate="01-01-2010"
maxDate="01-01-2030"
confirmBtnText="Confirm"
cancelBtnText="Cancel"
customStyles={{
dateIcon: {
position: 'absolute',
left: 0,
top: 4,
marginLeft: 0
},
dateInput: {
marginLeft: 36
}
}}
onDateChange={(date) => {this.setState({date: date})}}
/>
</View>
)
}
}
const styles = StyleSheet.create ({
container: {
flex: 1,
alignItems: 'center',
justifyContent:'center',
marginTop: 50,
padding:16
}
})

