FullCalendar资源标题无法正常显示问题求助
FullCalendar资源标题显示为 问题排查求助
根据FullCalendar v5官方文档,只要提供包含id和title属性的JS对象数组,资源就应该正常显示。但我使用ResourceTimelineWeek视图时,出现了异常情况:

可以看到资源已经存在于DOM中,ID值和数据库API返回的一致,但奇怪的是title显示成了 !
我一开始怀疑是数据库返回的数据有问题,但调试后确认数据是正常的:

以下是我相关的代码实现:
映射数据库数据的函数
protected getResources(): ICalendarResourceInput[] { this.calendarResources = []; for (let i = 0; i < this.calendarResourceList.length; i++) { let calendarResource: RotaTemplateShiftCalendarResource = this.calendarResourceList[i]; let resource: ICalendarResourceInput = { id: String(calendarResource.Id), title: calendarResource.Title, }; this.calendarResources.push(resource); } return this.calendarResources; }
日历选项中配置资源获取的逻辑
let resourceFunction: CalendarResourcesFunc = (args: CalendarResourceArgs, success: CalendarResourceSuccess, failure: CalendarResourceFailure) => { if (refreshResources) { // 重新填充列表 this.calendarEventList = []; this.calendarResourceList = []; this.populateCalendarData(new Date("2001-01-01"), new Date("2001-12-31")); } refreshResources = true; this.fetchResourceForCalendar(args, success, failure); }; options.resourceOrder = "displayOrder" as any; options.resources = resourceFunction as any;
填充日历数据的函数
protected populateCalendarData(startDate: Date, thresholdDate: Date): void { let response: RotaTemplateShiftCalendarResponse = this.getRotaCalendarData( startDate, thresholdDate, RotaCalendarDataType.Staff, this.values.ouId); this.calendarResourceList = response.Resources; this.calendarEventList = response.Events; }
获取日历资源的函数
protected fetchResourceForCalendar(args: CalendarResourceArgs, success: CalendarResourceSuccess, failure: CalendarResourceFailure) { success(this.getResources()); } protected getResources(): ICalendarResourceInput[] { this.calendarResources = []; for (let i = 0; i < this.calendarResourceList.length; i++) { let calendarResource: RotaTemplateShiftCalendarResource = this.calendarResourceList[i]; let resource: ICalendarResourceInput = { id: String(calendarResource.Id), title: calendarResource.Title, }; this.calendarResources.push(resource); } return this.calendarResources; }
现在我不确定还能尝试哪些方法来排查问题原因,希望能得到帮助。
内容的提问来源于stack exchange,提问作者RedPanda83
相关产品推荐
相关产品推荐

