## DateTimePicker Seleccionar fecha y tiempo juntos en un picker. :::tip DateTimePicker se deriva de DatePicker y TimePicker. Por una explicación más detallada sobre `pickerOptions` y otros atributos, puede referirse a DatePicker y TimePicker. ::: ### Fecha y hora :::demo Puede seleccionar la fecha y la hora en un picker al mismo tiempo configurando el tipo de fecha y la hora. La forma de utilizar los atajos es la misma que con Date Picker. ```html ``` ::: ### Alcance de fecha y tiempo :::demo Puede seleccionar la fecha y el rango de tiempo ajustando `type` a `datetimerange`. ```html ``` ::: ### Atributos | Atributos | Descripción | Tipo | Valores aceptados | Por defecto | | ------------------ | ---------------------------------------- | ----------------- | ---------------------------------------- | ----------- | | readonly | si DatePicker es solo de lectura | boolean | — | false | | disabled | si DatePicker esta deshabilitada | boolean | — | false | | editable | Si la entrada es editable | boolean | — | true | | clearable | Si mostrar el botón de `clear` | boolean | — | true | | size | tamaño del input | string | large/small/mini | — | | placeholder | placeholder cuando el modo NO es Range | string | — | — | | start-placeholder | placeholder para el inicio de fecha en el modo Range | string | — | — | | end-placeholder | placeholder para el fin de fecha en el modo Range | string | — | — | | time-arrow-control | si se puede modificar el `time` utilizando botones con flechas | boolean | — | false | | type | tipo del picker | string | year/month/date/datetime/ week/datetimerange/daterange | date | | format | formato de valor mostrado en el input | string | año `yyyy` mes `MM` día `dd`, hora `HH`, minuto `mm`, segundo `ss` | yyyy-MM-dd | | alinear | alineación | left/center/right | left | | | popper-class | nombre de clase personalizado para el Dropdown de DatePicker | string | — | — | | picker-options | opciones adicionales, Comprueba la tabla de mas abajo | object | — | {} | | range-separator | separador de rango | string | - | '-' | | default-value | opcional, fecha predeterminada del calendario | Fecha | cualquier cosa aceptada por `new Date()` — | | | value-format | opcional, formato de valor de enlazado. Si no se especifica, el valor de enlazado será un objeto Date | cadena | año `yyyy`, mes `MM`, día `dd`, hora `HH`, minuto `mm`, segundo `ss` | — | | name | igual que `name` en la entrada nativa | string | — | — | | unlink-panels | desconectar dos date-panels en range-picker | boolean | — | false | ### Picker Options | Atributo | Descripción | Tipo | Valores aceptados | Por defecto | | -------------- | ---------------------------------------- | -------- | ----------------- | ----------- | | shortcuts | un array de objetos { text, onClick } para establecer las opciones de acceso directo, verifique la tabla debajo | objeto[] | — | — | | disabledDate | una función que determina si una fecha está desactivada con esa fecha como parámetro. Debería devolver un booleano | función | — | — | | firstDayOfWeek | primera día de semana | Número | 1 to 7 | 7 | ### Accesos directos | Atributo | Descripción | Tipo | Valores aceptados | Por defecto | | -------- | ---------------------------------------- | -------- | ----------------- | ----------- | | text | título del acceso directo | string | — | — | | onClick | la funcion se dispara cuando se hace clic en el acceso directo, con el `vm` como parámetro. Puede modificar el valor del picker emitiendo el evento`pick`. Ejemplo: `vm.$emit('pick', new Date())` | function | — | — | ### Eventos | Nombre de evento | Descripción | Parámetros | | ---------------- | ---------------------------------------- | ----------------------------- | | change | Se dispara cuando el usuario confirma el valor | valor enlazado del componente | | blur | Se dispara cuando el input pierde el foco | instancia del componente | | focus | Se dispara cuando el input obtiene el foco | instancia del componente | ### Métodos | Método | Descripción | Parámetros | | ------ | ---------------- | ---------- | | focus | foco en el input | — |