尝试使用事件(作为函数)从 geojson 导入数据，但无法显示任何内容。对于我的特定情况，缺乏 v4 示例使我很难做到这一点，并且没有错误。我的代码如下。"事件列表"是根据我在 myevents 函数中的调试.log(事件列表)正确制作的。由于某种原因，我的事件不显示。
任何帮助都会很棒
<html lang='en'>
<head>
<meta charset='utf-8' />
<script src="https://code.jquery.com/jquery-3.4.1.js" integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU=" crossorigin="anonymous"></script>
<link href='https://unpkg.com/@fullcalendar/core@4.2.0/main.min.css' rel='stylesheet' />
<link href='https://unpkg.com/@fullcalendar/daygrid@4.2.0/main.min.css' rel='stylesheet' />
<script src='https://unpkg.com/@fullcalendar/core@4.2.0/main.min.js'></script>
<script src='https://unpkg.com/@fullcalendar/daygrid@4.2.0/main.min.js'></script>
</head>
<body><div id='calendar' class="mycal"></div></body>
<script>
function myevents()
{
var eventlist = [];
var script = document.createElement('script');
script.src = 'https://uploads-ssl.webflow.com/5b5a1fce48210813dc66ccb6/5d2f8540e5892f506213cb11_Output.txt';
document.getElementsByTagName('head')[0].appendChild(script);
window.eqfeed_callback = function(results)
{
for (var i = 0; i < results.features.length; i++)
{
var obj = {};
obj['title'] = results.features[i].properties.eventname;
obj['start'] = results.features[i].properties.datestart;
obj['end'] = results.features[i].properties.dateend;
eventlist.push(obj);
}
}
console.log(eventlist);
return eventlist;
}
document.addEventListener('DOMContentLoaded', function() {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
plugins: [ 'interaction', 'dayGrid'],
defaultView: 'dayGridMonth',
contentHeight: 'auto',
header: { left: 'prev,next', center: '', right: 'title' },
events: function(info, successCallback, failureCallback) {
successCallback(myevents());
}
});
calendar.render();
});
</script>
</html>
如果您记录每个单独obj的创建并注意日志在控制台中出现的顺序(特别是与记录整个事件列表时相比)，您可能会开始看到问题 - 通过此演示观察：https://codepen.io/ADyson82/pen/pMEZNE .还要记住，像 Chrome 这样的浏览器可以动态地追溯填充对象的日志(换句话说，它可以创建日志条目，然后稍后在代码中更新对象时向其添加数据)，这在您尝试调试此类问题时并不总是有帮助。
我的意思是你没有考虑到你的脚本文件将被异步加载的事实......
幸运的是，由于 fullCalendar 已经为您提供了在您准备好返回事件时调用successCallback，因此非常适合使用异步方案。您只需在异步eq_feedbackCallback中调用 successCallback。这将确保您不会在实际填充事件列表之前将其发送到 fullCalendar。
function myevents(info, successCallback, failureCallback) {
var script = document.createElement("script");
script.src =
"https://uploads-ssl.webflow.com/5b5a1fce48210813dc66ccb6/5d2f8540e5892f506213cb11_Output.txt";
document.getElementsByTagName("head")[0].appendChild(script);
window.eqfeed_callback = function(results) {
var eventlist = [];
for (var i = 0; i < results.features.length; i++) {
var obj = {};
obj["title"] = results.features[i].properties.eventname;
obj["start"] = results.features[i].properties.datestart;
obj["end"] = results.features[i].properties.dateend;
eventlist.push(obj);
}
successCallback(eventlist);
};
}
document.addEventListener("DOMContentLoaded", function() {
var calendarEl = document.getElementById("calendar");
var calendar = new FullCalendar.Calendar(calendarEl, {
plugins: ["interaction", "dayGrid"],
defaultView: "dayGridMonth",
contentHeight: "auto",
header: { left: "prev,next", center: "", right: "title" },
events: myevents
});
calendar.render();
});
演示：https://codepen.io/ADyson82/pen/gVwjzY