Year view on FullCalendar v5

Viewed 1132

I'm using FullCalendar v5 with react. I need to show a year view, like the one GoogleCalendar has: https://prnt.sc/vljfwj. I have seen that FullCalendar doesn't have a plugin or smth. What I'm trying to do, is creating a custom view, but I don't seem to manage it well. Can someone help me on how it is done?

<FullCalendar
    plugins={[dayGridPlugin, timeGridPlugin, interactionPlugin]}
    headerToolbar={false}
    initialView='timeGridWeek'
    views={{
        dayGridMonth: {
            type: 'month',
            duration: { months: 12 },
            monthMode: true,
            fixedWeekCount: true,
        }
    }}
    dayHeaderFormat={{ weekday: 'long', day: 'numeric', omitCommas: true }}
/>

I'm changing views on a button, which calls this code

changeSelectedGrid = selectedViewGrid => {
    if (this.fullCalendarRef.current) {
        const calendarApi = this.fullCalendarRef.current.getApi();
        calendarApi.changeView(selectedViewGrid, moment(this.state.selectedDate).startOf('year'), moment(this.state.selectedDate).endOf('year'));
    }
};
0 Answers
Related