Using v-calendar with events coming in time and date format

May 11, 2023

when I look for the api event, the time would be ex: 12:00 the v-calendar abbreviates to just 12, if I look for the time that password the minutes it brings complete, since it seems to be a vuetify v-calendar behavior, someone already solved?

enter image description here

Problema com abreviação do vuetify v-calendar

>Solution :

You can use the slot #event inside VCalendar component. Like this:

<v-calendar>
    <template #event={ parsedEvent, event }>
        {{ parsedEvent.start.time }} - {{ event.name }}
    </template>
</v-calendar>

parsedEvent: All the data from your event already formated.
event: The data from your events array.

Using like this, you can create custom views for your events.
Remember that you use the #event slot, the event-name will be ignorated by the VCalendar component, so you will need to destruct { event } to access this property.

I suggest you to read more about the slots from the vuetify documentation.
https://v2.vuetifyjs.com/en/api/v-calendar/