FullCalander Vue
I have problem with fullCalander Package when i build the project the problem is when i put a dynamic events ( using ref or reactive ) they block the page without any response i get also warning in browser about : ( in the dev mode )
"runtime-core.esm-bundler.js:40 [Vue warn]: Maximum recursive updates exceeded. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function."
here's my code for FullCalander use :
<fullcalendar class="demo-app-calendar" :options="calendarOptions"></fullcalendar>
const calendarOptions = ref({
plugins: [dayGridPlugin, timeGridPlugin, listPlugin, interactionPlugin],
headerToolbar: {
left: "prev,next today",
center: "title",
right: "dayGridMonth,timeGridWeek,timeGridDay",
},
initialDate: TODAY,
navLinks: true, // can click day/week names to navigate views
selectable: true,
selectMirror: true,
views: {
dayGridMonth: { buttonText: "month" },
timeGridWeek: { buttonText: "week" },
timeGridDay: { buttonText: "day" },
},
editable: true,
dayMaxEvents: true, // allow "more" link when too many events
events: schedulesOptions.value,
dateClick: newReview,
eventClick: newReview,
});
const getSchedules = async (id) => {
// alert(id)
try {
const res = await ApiService.get(
`${props.eventsUrl}?empolyee_id=${id}`
);
const schedules = res.data;
calendarOptions.value.events = schedules;
} catch (error) {
console.error(error);
}
};Replies (1)
Hi,
Thank you for reaching out to us.
Could you please clarify when you're calling the getSchedules function?
Also, ensure that your API returns the events array in the correct format. You can check event object available properties here.
Regards,
Lauris Stepanovs,
Keenthemes Support Team
React Dev Vacancy
