#javascript #reactjs #fullcalendar #fullcalendar-scheduler #fullcalendar-5
#javascript #reactjs #полный календарь #fullcalendar-планировщик #полный календарь-5
Вопрос:
Я использую компонент FullCalendar React с представлением временной шкалы ресурсов. Моя цель — получать только события для области, которую пользователь действительно может видеть. Из-за структуры моего API я не могу предоставить канал JSON. Итак, согласно документам, события являются функцией. Я начал реализовывать решение для этого подхода, но проблема в том, что функция вызывается только тогда, когда я фактически нажимаю кнопку для следующего или предыдущего, но не тогда, когда я просто прокручиваю временную шкалу, но это то, что мне действительно нужно. Возможно ли это с помощью Fullcalendar? Чтобы вам было как можно проще воспроизвести это поведение, вот компонент, который я реализовал:
import FullCalendar from '@fullcalendar/react'
import resourceTimelinePlugin from '@fullcalendar/resource-timeline';
function App() {
return (
<FullCalendar
plugins={[ resourceTimelinePlugin ]}
initialView="resourceTimelineYear"
schedulerLicenseKey = "CC-Attribution-NonCommercial-NoDerivatives"
resources={
[
{id: "a",title: "Room A"},
{id: "b",title: "Room B"},
{id: 'c',title: 'Room C'}
]
}
events={
function(fetchInfo, successCallback, failureCallback) {
console.log("Call!"); /* only called when prev. or next button is
pressed but not when scrolling through the timeline */
}
}
height={650}
/>
);
}
export default App;
Комментарии:
1.
Is this achievable with Fullcalendar… нет, потому что календарь не может знать, что в данный момент отображается на экране. Он не знает ширину календаря в этот точный момент (а что, если вы измените размер области просмотра во время использования?) и, следовательно, что видно / не видно. Потенциально это также может привести к большому количеству ненужных запросов. Он будет извлекать события для определенных дат начала и окончания. Кажется, вы указали целый год. Если вы не собираетесь легко отображать весь год сразу, то, возможно, вместо этого определите представление как месяц или 3-месячный период?2. @ADyson Спасибо за быстрый ответ. Итак, теперь, когда я знаю, что это нельзя сделать с помощью прокрутки, мой вариант будет заключаться в том, что пользователь использует предыдущие и следующие кнопки для навигации, чтобы работать с правильной выборкой событий как функцией, верно? Поэтому каждый раз, когда он нажимал одну из этих кнопок, вызывалась моя функция, и события за указанный промежуток времени внутри fetchInfo помещались в календарь. Правильно ли я понимаю здесь?
3. да, это так. Если бы это был я, я бы установил меньший период времени для просмотра (например, 1 месяц или, возможно, 3 месяца, как я уже упоминал), а затем пользователь может использовать next / prev для перехода дальше вперед или дальше назад. Затем это приведет к запуску функции events и запросу новых событий каждый раз, когда они переходят к периоду времени, для которого события еще не были загружены.
4. Спасибо за разъяснение, месяц для просмотра кажется мне разумным. С точки зрения пользователей немного грустно, что это невозможно сделать с помощью прокрутки, но, как вы упомянули в своем первом сообщении, если бы это можно было сделать, это было бы действительно сложно. Поэтому я воспользуюсь подходом к решению, который вы посоветовали. Еще раз спасибо за быстрые и действительно полезные пояснения здесь.