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 :

<pre> <FullCalendar class="demo-app-calendar" :options="calendarOptions" /> 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); } }; </pre>