Framework7日历事件使用AJAX onMonthAdd加载
类似的问题，但我相信仍然有着独特的不同： Framework7 datepicker在初始化后修改事件
我有一个内联日历，其中包含从AJAX脚本加载的事件，我可以使其工作，但是将来会有数百个事件需要多年。 我需要的是一种只加载月份事件并根据需要添加它们的方法。 我认为这可以通过onMonthAdd来完成，但我遇到的问题是，当我将一个新元素推送到p.events时，直到月份从元素中删除并重新读取才会加载新事件。
例如：1月份的onMonthAdd我在1月11日添加一个事件。然后当1月进入视图时，不显示该事件。 但是，当我导航回到12月然后到11月时，1月份的日历将从DOM中删除。 然后导航回到1月，在DOM中重新创建月份，然后它将显示事件。
主要问题是， 如果在将月添加到DOM后onMonthAdd似乎被触发 ， 如何在DOM中创建元素之前添加事件是如何可能 的 。 我找不到对beforeMonthAdd函数的任何引用。
如果我能找到一种简单地将事件（没有AJAX）添加到添加的月份的方法，AJAX是非相关的，我可以使它工作。
这是我尝试过的一些代码（不包括AJAX），但它不能用于创建日历，但在重新创建DOM的月份之前不会使用新日期进行更新：
... var calendarInline = myApp.calendar({ container: '#calendar-inline-container', weekHeader: true, firstDay: 0, events: [ new Date(2017,7,1), new Date(2017,7,31), new Date(2017,8,1), new Date(2017,8,30), new Date(2017,9,1), new Date(2017,9,31), new Date(2017,10,1), new Date(2017,10,30), new Date(2017,11,1), new Date(2017,11,31) ], onMonthAdd: function(p,monthContainer){ var thisYear = $(monthContainer).find('picker-calendar-month').context.attributes['data-year'].value; var thisMonth = $(monthContainer).find('picker-calendar-month').context.attributes['data-month'].value; if(thisMonth==0){ p.params.events.push(new Date(thisYear,thisMonth,11)); } }, }); ... 通过使用当前年份和月份执行setYearMonth来“重新加载”日历，我找到了一种迂回的方式来实现这一点，但问题是当改变年份时它实际上会创建一个无限循环，这里的代码是那：
... onMonthAdd: function(p,monthContainer){ var thisYear = $(monthContainer).find('picker-calendar-month').context.attributes['data-year'].value; var thisMonth = $(monthContainer).find('picker-calendar-month').context.attributes['data-month'].value; if(thisMonth==0){ p.params.events.push(new Date(thisYear,thisMonth,11)); p.setYearMonth(p.currentYear, p.currentMonth, 1); } }, ...
关于framework7和calendar对象的一些发现：
- 月份在开始时加载三个（前一个，当前一个和下一个）
- 添加后事件不会被删除，并且即使在从DOM中删除该月份后仍保留在日历对象中
- 除了减慢脚本速度之外，同一日期的多个事件也没有任何效果。
- 之前没有回调，只有在月之后添加
- 可以通过调用setYearMonth并将持续时间设置为1毫秒来重新加载DOM，以便不进行明显的转换
这是修复，我没有发布所有实际代码，只是过程
- 创建一个数组变量来存储已处理的日期和从AJAX检索的事件，以防止额外的工作和无限循环
- 在处理ajax调用之前，请检查month + year是否已经处理了month数组
- 如果不在数组中添加到数组并使用AJAX检索事件
- 在AJAX完成并且数据有效后添加到p.param.events并使用setYearMonth在DOM中重新加载日历
这对我的项目非常有效，用户交互流畅而快速。