Open Luckygirlllll opened 6 years ago
you could use moment.js to parse your "hh:mm a" and convert it to a unix time stamp with .unix(), but you need the date as well to create an epoch timestamp
I am in the same case. I want to display the date in a custom format (using date-fns
library) and to catch the date of onDateChange in a getTime()
format to store it in the DB.
getDateStr={date => {
const newDate = format(date, "Do MMM YYYY [à] HH:mm", {
locale: frLocale
});
return newDate;
}} // this way the date displayed is in the right format
onDateChange={Date => query(Date)}
// but the date inserted to the DataBase is in the custom format.
// usually the format in DB is not the same as the format displayed
// so what is the solution provided by <DatePicker /> in this case ?
I finally proceed like this (which is partially convenient) :
const fromFrToEn = dateParsed => {
let result = dateParsed.replace(/à/, "");
result = result.replace(/le /, "");
result = result.replace(/janv./, "Jan");
result = result.replace(/fév./, "Feb");
result = result.replace(/mars/, "Mar");
result = result.replace(/avr/, "Apr");
result = result.replace(/mai/, "May");
result = result.replace(/juin/, "Jun");
result = result.replace(/juill./, "Jul");
result = result.replace(/août/, "Aug");
result = result.replace(/sept./, "Sep");
result = result.replace(/oct./, "Oct");
result = result.replace(/nov./, "Nov");
result = result.replace(/déc./, "Dec");
return result;
};
<DatePicker
date={this.props.eventDate}
mode="datetime"
minDate={format(Date.now(), "le D MMM YYYY [à] HH:mm", {
locale: frLocale
})}
getDateStr={date => {
const newDate = format(date, "le D MMM YYYY [à] HH:mm", {
locale: frLocale
});
return newDate;
}}
onDateChange={date => {
this.props.onDateChange(
Date.parse(fromFrToEn(date)
// here I have to convert to getTime() format /
// which obliges me to create a function to translate eachj french month to english 😖
));
}}
/>
We can achieve that by wrapping it in a component:
0) Wrap it with Controller component from useForm hook 1) Add a local state date with type Date 2) for selected, give the Date value 3) for value, give the displayed string with proper format 4) for output, use setValue of useForm hook 5) Update the local state date during onChange
Above answer is right. But order is not good. so I am going to list again. We can achieve that by wrapping it in a component:
May 11, 2018
Issue
I want to display to user time in the format "hh:mm a", but in database I want to save time in the format of unix tamstamp? Is it possible to get unix timestamp from DatePicker?
Expected Behavior
Code
This is what I have right now:
Environment
react-native -v
: 0.55.3node -v
: v6.11.3npm -v
: 5.6.0yarn --version
: 1.5.1target platform
: Android | iOSoperating system
: MAC OS