fullcalendar - 如何设置所有谷歌日历事件以显示背景渲染?
问题描述
我正在使用 FullCalendar 4,并且正在从我的谷歌日历中导入事件。我希望这些在日历中显示为全天背景事件,以显示我很忙,而不是显示事件是什么,以及它持续了多长时间。导入事件并显示它们通常可以正常工作。
我尝试使用EventRender更改渲染属性,如下所示
eventRender: function(info) {
info.event.setProp( rendering, 'background' );
}
这似乎破坏了事件并且什么都不显示,当我在更新以记录开始日期后尝试访问事件时,我得到以下信息。
Failure parsing JSON {message: "Failure parsing JSON", xhr: XMLHttpRequest}
在 setProp 调用之前执行此操作会正确输出日期。
我在文档中注意到,当使用EventRender时,该函数还可以返回一个全新的元素,该元素将用于渲染。对于全天后台事件,您必须确保返回一个<td>
.'
但是,我在新文档或示例中找不到任何有关如何执行此操作的示例?
我还尝试在 EventsRender 和 DatesRender 中为每个循环创建一个循环来拉回所有事件,并为每个现有事件创建一个新的背景事件,然后销毁现有事件。不过,这似乎并不奏效。在 EventsRender 中完成后,我得到一个永久循环,因为该函数info.event.remove();
似乎永远无法工作。在 DatesRender 我得到一个新的背景事件,但仅在一个月的第二次渲染时,它不会删除现有的。请参阅下面的 DatesRender 代码。
datesRender: function(info) {
//now recreate events so they are all background events
var events = calendar.getEvents();
console.log("Dates Render!");
$.each(events, function( index, event ) {
//get event date
var date = event.start;
console.log(date);
//remove original event
event.remove();
//add new as a background event
calendar.addEvent({
title: 'dynamic event',
start: date,
allDay: true,
rendering: 'background',
backgroundColor: '#B2B2B2'
});
});
},
我显然在做一些暗淡的事情。谁能指出我正确的方向?
更新
正如建议的那样,您可以使用eventDataTransfer方法非常简单地做到这一点!
eventDataTransform: function(eventData) {
eventData.rendering = 'background';
},
解决方案
正如建议的那样,您可以使用eventDataTransfer方法非常简单地做到这一点!
eventDataTransform: function(eventData) {
eventData.rendering = 'background';
},
推荐阅读
- javascript - CHM 查看器禁止在 Windows 10 上访问 JavaScript 中的“窗口”对象
- apache-kafka - Kafka连接消费者引用偏移量并存储在消息中
- c - 这种对信号的解释是否正确?
- python-3.x - selenium.common.exceptions.ElementNotInteractableException:消息:元素不可交互(会话信息:chrome=81.0.4044.138)
- c - 在 C 中将节点添加到链表的末尾会导致堆栈转储
- xamarin - 当链接器设置为“全部链接”时,会发生 Xamarin 错误。无法使用依赖服务
- java - 如何在 Java 12 中迁移 nashorn 代码?
- python - 如何在 NLTK 中使用 word_tokenize 忽略单词之间的标点符号?
- python - pySpark从列表中添加列
- c++ - 计算地址差异是未定义的行为吗?