列表视图不显示 2024 年 1 月 1 日之前的事件

Question

我使用挂钩创建了一个具有多个视图、自定义事件渲染和上下文菜单的日历。所有功能都很好，除了一件事：当我切换列表视图时，日历仅显示 2024 年 1 月 1 日而不是 2018 年的事件。

我尝试了很多事情：

calendar.changeView('list', {start: '2018-01-01', end: '2050-01-01'})

有或没有时间和时区。还有

calendar.changeView('listAllYears', {start: '2018-01-01', end: '2050-01-'}) 

有多种变体（这是最广泛的一种）：

views: {
 listAllYears: {
    type: 'list',
    duration: { years: 100 },
    visibleRange: { start: '2018-01-01', end: '2050-01-01' },
    listDayFormat: { weekday: 'long',  month: 'long', day: 'numeric', year: 'numeric'},
    listDaySideFormat: { weekday: 'long',  month: 'long', day: 'numeric', year: 'numeric'},
  },
},

还有

calendar.setOption('visibleRange', { start: '2018-01-01', end: '2050-01-01' }) 

amd 之前，changeView 命令之后。

根据组合，我得到的最好的结果是标题显示正确的日期范围，但不显示事件。

我跟踪了数据，自 2018 年以来所有事件都提供到日历中。

我希望列表显示自 2018 年以来的事件，而不仅仅是自 2024 年 1 月 1 日以来的事件。

Answer 1

您的自定义列表视图的设置是矛盾的。您不能指定视图的持续时间为 100 年，和同时指定可见范围在 2018 年到 2050 年之间 - 范围只有 32 年！

Fullcalendar 使用

duration

值并忽略

visibleRange

。默认情况下，

visibleRange

仅在没有为视图指定标准

duration

时才生效。

只需删除

duration: { years: 100 }

设置，我想你就会得到你期望的效果。

views: {
 listAllYears: {
    type: 'list',
    visibleRange: { start: '2018-01-01', end: '2050-01-01' },
    listDayFormat: { weekday: 'long',  month: 'long', day: 'numeric', year: 'numeric'},
    listDaySideFormat: { weekday: 'long',  month: 'long', day: 'numeric', year: 'numeric'},
  },
},

演示：https://codepen.io/ADyson82/pen/ZYzeLXM