Calendar

The v-calendar component is used to display information in a daily, weekly, or monthly view. The daily view has slots for all day or timed elements, and the weekly and monthly view has a slot for each day.

Utilização

A calendar has a type and a value which determines what type of calendar is shown over what span of time.

API

Nome

color

Padrão

undefined

Tipos

string

Components.Calendars.

Nome

dark

Padrão

false

Tipos

boolean

Components.Calendars.

Nome

day-format

Padrão

null

Tipos

function

Components.Calendars.

Nome

end

Padrão

'0000-00-00'

Tipos

string

Components.Calendars.

Nome

first-interval

Padrão

Tipos

number | string

Components.Calendars.

Nome

hide-header

Padrão

false

Tipos

boolean

Components.Calendars.

Nome

interval-count

Padrão

Tipos

number | string

Components.Calendars.

Nome

interval-format

Padrão

null

Tipos

function

Components.Calendars.

Nome

interval-height

Padrão

Tipos

number | string

Components.Calendars.

Nome

interval-minutes

Padrão

Tipos

number | string

Components.Calendars.

Nome

interval-style

Padrão

null

Tipos

function

Components.Calendars.

Nome

light

Padrão

false

Tipos

boolean

Components.Calendars.

Nome

locale

Padrão

'en-us'

Tipos

string

Components.Calendars.

Nome

max-days

Padrão

Tipos

number

Components.Calendars.

Nome

min-weeks

Padrão

Tipos

any

Components.Calendars.

Nome

month-format

Padrão

null

Tipos

function

Components.Calendars.

Nome

now

Padrão

undefined

Tipos

string

Components.Calendars.

Nome

short-intervals

Padrão

true

Tipos

boolean

Components.Calendars.

Nome

short-months

Padrão

true

Tipos

boolean

Components.Calendars.

Nome

short-weekdays

Padrão

true

Tipos

boolean

Components.Calendars.

Nome

show-interval-label

Padrão

null

Tipos

function

Components.Calendars.

Nome

show-month-on-first

Padrão

true

Tipos

boolean

Components.Calendars.

Nome

start

Padrão

'2024-11-12'

Tipos

string

Components.Calendars.

Nome

type

Padrão

'month'

Tipos

string

Components.Calendars.

Nome

value

Padrão

undefined

Tipos

string

Controla visibilidade

Nome

weekday-format

Padrão

null

Tipos

function

Components.Calendars.

Nome

weekdays

Padrão

[0,1,2,3,4,5,6]

Tipos

array

Components.Calendars.

Exemplos

Slots

Slots allow you to define the content for each day, time interval for the daily views, and various labels.

Events

This is an example of an event calendar with type of month. Click on an event to show event details.

Weekly

This is an example of an event calendar with all-day and timed events with a type of week.

Daily

This is an example of calendar with content in each interval slot and a type of day.

Features

This example allows you to explore many of the features of the v-calendar component.

Up Next

Edit this page | language on Github

— Contribution Guide