## DatePicker
Use Date Picker for date input.
### Enter Date
Basic date picker measured by 'day'.
:::demo The measurement is determined by the `type` attribute. You can enable quick options by creating a `picker-options` object with `shortcuts` property. The disabled date is set by `disabledDate`, which is a function.
```html
Default
Picker with quick options
```
:::
### Other measurements
You can choose week, month or year by extending the standard date picker component.
:::demo
```html
Week
Month
Year
```
:::
### Date Range
Picking a date range is supported.
:::demo
```html
Default
With quick options
```
:::
### Attributes
| Attribute | Description | Type | Accepted Values | Default |
|---------- |-------------- |---------- |-------------------------------- |-------- |
| readonly | if the picker is read only | boolean | — | false |
| placeholder | placeholder | string | — | — |
| type | type of the picker | string | year/month/date/datetime/week/datetimerange/daterange | date |
| format | format of the picker | string | year `yyyy` month `MM` day `dd`， hour `HH`, minute `mm`, second `ss` | yyyy-MM-dd |
| align | alignment | left/center/right | left |
| picker-options | additional options, check the table below | object | — | {} |
### Picker Options
| Attribute | Description | Type | Accepted Values | Default |
|---------- |-------------- |---------- |-------------------------------- |-------- |
| shortcuts | a { text, onClick } object array to set shortcut options, check the table below | object[] | — | — |
| disabledDate | a function determining if a date is disabled with that date as its parameter. Should return a Boolean | function | — | — |
### shortcuts
| Attribute | Description | Type | Accepted Values | Default |
|---------- |-------------- |---------- |-------------------------------- |-------- |
| text | title of the shortcut | string | — | — |
| onClick | callback function, triggers when the shortcut is clicked, with the `vm` as its parameter. You can change the picker value by emitting the `pick` event. Example: `vm.$emit('pick', new Date())`| function | — | — |