mirror of
https://github.com/element-plus/element-plus.git
synced 2024-11-21 01:02:59 +08:00
docs: [date-picker] unified format (#18536)
* docs: [date-picker] unified format * Update docs/en-US/component/datetime-picker.md
This commit is contained in:
parent
048482bcb2
commit
91c76cd600
@ -79,38 +79,38 @@ datetime-picker/custom-icon
|
||||
|
||||
## Attributes
|
||||
|
||||
| Name | Description | Type | Accepted Values | Default |
|
||||
| ----------------------- | -------------------------------------------------------------------------------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------- | ------------------- |
|
||||
| model-value / v-model | binding value, if it is an array, the length should be 2 | Date / number / string / Array | — | — |
|
||||
| readonly | whether DatePicker is read only | boolean | — | false |
|
||||
| disabled | whether DatePicker is disabled | boolean | — | false |
|
||||
| editable | whether the input is editable | boolean | — | true |
|
||||
| clearable | whether to show clear button | boolean | — | true |
|
||||
| size | size of Input | string | large/default/small | default |
|
||||
| placeholder | placeholder in non-range mode | string | — | — |
|
||||
| start-placeholder | placeholder for the start date in range mode | string | — | — |
|
||||
| end-placeholder | placeholder for the end date in range mode | string | — | — |
|
||||
| arrow-control | whether to pick time using arrow buttons | boolean | — | false |
|
||||
| type | type of the picker | string | year/month/date/datetime/ week/datetimerange/daterange | date |
|
||||
| format | format of the displayed value in the input box | string | see [date formats](/en-US/component/date-picker#date-formats) | YYYY-MM-DD HH:mm:ss |
|
||||
| popper-class | custom class name for DateTimePicker's dropdown | string | — | — |
|
||||
| range-separator | range separator | string | — | '-' |
|
||||
| default-value | optional, default date of the calendar | Date / [Date, Date] | | — |
|
||||
| default-time | the default time value after picking a date. Time `00:00:00` will be used if not specified | Date / [Date, Date] | — | — |
|
||||
| value-format | optional, format of binding value. If not specified, the binding value will be a Date object | string | see [date formats](https://day.js.org/docs/en/display/format) | — |
|
||||
| date-format ^(2.4.0) | optional, format of the date displayed value in TimePicker's dropdown | string | see [date formats](https://day.js.org/docs/en/display/format) | — |
|
||||
| time-format ^(2.4.0) | optional, format of the time displayed value in TimePicker's dropdown | string | see [date formats](https://day.js.org/docs/en/display/format) | — |
|
||||
| id | same as `id` in native input | string / [string, string] | — | — |
|
||||
| name | same as `name` in native input | string | — | — |
|
||||
| unlink-panels | unlink two date-panels in range-picker | boolean | — | false |
|
||||
| prefix-icon | Custom prefix icon component | `string \| Component` | — | Date |
|
||||
| clear-icon | Custom clear icon component | `string \| Component` | — | CircleClose |
|
||||
| shortcuts | an object array to set shortcut options | object[{ text: string, value: date / function }] | — | — |
|
||||
| disabled-date | a function determining if a date is disabled with that date as its parameter. Should return a Boolean | function(Date) | — | — |
|
||||
| cell-class-name | set custom className | Function(Date) | — | — |
|
||||
| teleported | whether datetime-picker dropdown is teleported to the body | boolean | true / false | true |
|
||||
| empty-values ^(2.7.0) | empty values of component, [see config-provider](/en-US/component/config-provider#empty-values-configurations) | ^[array] | — |
|
||||
| value-on-clear ^(2.7.0) | clear return value, [see config-provider](/en-US/component/config-provider#empty-values-configurations) | ^[string] / ^[number] / ^[boolean] / ^[Function] | — |
|
||||
| Name | Description | Type | Default |
|
||||
| ----------------------- | -------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------- | ------------------- |
|
||||
| model-value / v-model | binding value, if it is an array, the length should be 2 | ^[number] / ^[string] / ^[object]`Date \| [Date, Date] \| [string, string]` | — |
|
||||
| readonly | whether DatePicker is read only | ^[boolean] | false |
|
||||
| disabled | whether DatePicker is disabled | ^[boolean] | false |
|
||||
| editable | whether the input is editable | ^[boolean] | true |
|
||||
| clearable | whether to show clear button | ^[boolean] | true |
|
||||
| size | size of Input | ^[enum]`'large' \| 'default' \| 'small'` | default |
|
||||
| placeholder | placeholder in non-range mode | ^[string] | — |
|
||||
| start-placeholder | placeholder for the start date in range mode | ^[string] | — |
|
||||
| end-placeholder | placeholder for the end date in range mode | ^[string] | — |
|
||||
| arrow-control | whether to pick time using arrow buttons | ^[boolean] | false |
|
||||
| type | type of the picker | ^[enum]`'year' \| 'month' \| 'date' \| 'datetime' \| 'week' \| 'datetimerange' \| 'daterange'` | date |
|
||||
| format | format of the displayed value in the input box | ^[string] see [date formats](/en-US/component/date-picker#date-formats) | YYYY-MM-DD HH:mm:ss |
|
||||
| popper-class | custom class name for DateTimePicker's dropdown | ^[string] | — |
|
||||
| range-separator | range separator | ^[string] | '-' |
|
||||
| default-value | optional, default date of the calendar | ^[object]`Date \| [Date, Date]` | — |
|
||||
| default-time | the default time value after picking a date. Time `00:00:00` will be used if not specified | ^[object]`Date \| [Date, Date]` | — |
|
||||
| value-format | optional, format of binding value. If not specified, the binding value will be a Date object | ^[string] see [date formats](https://day.js.org/docs/en/display/format) | — |
|
||||
| date-format ^(2.4.0) | optional, format of the date displayed value in TimePicker's dropdown | ^[string] see [date formats](https://day.js.org/docs/en/display/format) | — |
|
||||
| time-format ^(2.4.0) | optional, format of the time displayed value in TimePicker's dropdown | ^[string] see [date formats](https://day.js.org/docs/en/display/format) | — |
|
||||
| id | same as `id` in native input | ^[string] / ^[object]`[string, string]` | — |
|
||||
| name | same as `name` in native input | ^[string] | — |
|
||||
| unlink-panels | unlink two date-panels in range-picker | ^[boolean] | false |
|
||||
| prefix-icon | Custom prefix icon component | ^[string] / `Component` | Date |
|
||||
| clear-icon | Custom clear icon component | ^[string] / `Component` | CircleClose |
|
||||
| shortcuts | an object array to set shortcut options | ^[object]`Array<{ text: string, value: Date \| Function }>` | — |
|
||||
| disabled-date | a function determining if a date is disabled with that date as its parameter. Should return a Boolean | ^[Function]`(data: Date) => boolean` | — |
|
||||
| cell-class-name | set custom className | ^[Function]`(data: Date) => string` | — |
|
||||
| teleported | whether datetime-picker dropdown is teleported to the body | ^[boolean] | true |
|
||||
| empty-values ^(2.7.0) | empty values of component, [see config-provider](/en-US/component/config-provider#empty-values-configurations) | ^[array] | — |
|
||||
| value-on-clear ^(2.7.0) | clear return value, [see config-provider](/en-US/component/config-provider#empty-values-configurations) | ^[string] / ^[number] / ^[boolean] / ^[Function] | — |
|
||||
|
||||
## Events
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user