Formats a date based on the locale and options.
import { FormattedDate } from 'react-native-globalize';
const ExampleComponent = () => (
<FormattedDate
value={new Date(2020, 0, 1)}
skeleton="yMd"
/>
);
// 1/1/2020
Note: Specify one of date
, datetime
, skeleton
, or time
.
Type |
Required |
Default |
Description |
string |
No |
none |
Shorthand date-only formatting specification. Possible values: full , long , medium , short . |
<FormattedDate
value={new Date(2020, 0, 1)}
date="full"
/>
// Wednesday, January 1, 2020
Type |
Required |
Default |
Description |
string |
No |
none |
Shorthand date and time formatting specification. Possible values: full , long , medium , short . |
<FormattedDate
value={new Date(2020, 0, 1)}
datetime="full"
/>
// Wednesday, January 1, 2020 at 12:00:00 AM GMT-08:00
Type |
Required |
Default |
Description |
string |
No |
none |
Flexible formatting mechanism using a pattern with fields in canonical order. See list of skeleton patterns (not all options supported). |
<FormattedDate
value={new Date(2020, 0, 1)}
skeleton="yMMMdhm"
/>
// Jan 1, 2020, 12:00 AM
Type |
Required |
Default |
Description |
string |
No |
none |
Shorthand time-only formatting specification. Possible values: full , long , medium , short . |
<FormattedDate
value={new Date(2020, 0, 1)}
time="full"
/>
// 12:00:00 AM GMT-08:00
Type |
Required |
Default |
Description |
Date |
Yes |
none |
Date object to be formatted. |