DatePicker ​

Utilice Date Picker para introducir fechas.

Introducir fecha ​

Selector de fecha básico medido por 'día'.

Otras mediciones ​

Puede elegir una semana, un mes, un año o varias fechas ampliando el componente de selector de fechas estándar.

Rango de fechas ​

Se admite la selección de un rango de fechas.

Rango de mes ​

Se admite la selección de un periodo de meses.

Year Range 2.8.0 ​

Picking a year range is supported.

Valor por defecto ​

Si el usuario no ha elegido una fecha, muestra el calendario de hoy por defecto. Puede utilizar default-value para fijar otra fecha. Su valor debe ser analizable por new Date().

Si el tipo es daterange, default-value establece el valor para el calendario del lado izquierdo.

Formatos de Fecha ​

Utilice format para controlar el formato del texto visualizado en el input. Utilice value-format para controlar el formato del valor vinculado.

Por defecto, el componente acepta y emite un objeto Date.

Revise la lista aquí de todos los formatos disponibles de Day.js.

Hora por defecto para comienzo y fin de fecha ​

Al seleccionar un rango de fechas, puede asignar la parte de la hora para la fecha de inicio y la fecha de finalización.

Establecer contenido personalizado del prefijo ​

El contenido del prefijo puede ser personalizado.

Contenido personalizado ​

The content of cell can be customized, in scoped-slot you can get the cell data. Note that the custom content structure should be consistent with the default structure, otherwise style misalignment may occur.

Custom icon 2.8.0 ​

Custom icons available with slots.

Para detalles de datos, por favor refiérase a:

interface DateCell {
  column: number
  customClass: string | undefined
  disabled: boolean
  end: boolean
  inRange: boolean
  row: number
  selected: Dayjs | undefined
  isCurrent: boolean | undefined
  isSelected: boolean
  renderText: string | undefined
  start: boolean
  text: number
  timestamp: number
  date: Date
  dayjs: Dayjs
  type: 'normal' | 'today' | 'week' | 'next-month' | 'prev-month'
}

Localización ​

El idioma predeterminado es el inglés, si necesita utilizar otros idiomas, por favor revise Internacionalización

Nota, el locale de la fecha y hora (nombre del mes, primer día de la semana ...) también están configurados en la localización.

API ​

Attributes ​

Events ​

Slots ​

Exposes ​

Type Declarations ​

import type { Options as PopperOptions } from '@popperjs/core'

type TimeLikeType = 'datetime' | 'datetimerange'

type Placement =
  | 'top'
  | 'top-start'
  | 'top-end'
  | 'bottom'
  | 'bottom-start'
  | 'bottom-end'
  | 'left'
  | 'left-start'
  | 'left-end'
  | 'right'
  | 'right-start'
  | 'right-end'

Fuente ​

Componentes • Style • Documentación

Contribuidores ​