当CustomView具有visibleRange时，使用上一个/下一个在FullCalendar中导航

Question

[我的日历具有特定视图：显示31天（显示当前日期前4天，之后27天）

因此，我的视图具有动态的visibleRange

let INIT = moment().subtract(4, 'days').format('YYYY-MM-DD');
let INIT_END = moment(INIT).add(31,'days').format('YYYY-MM-DD');

[...]

  type: 'resourceTimeline',
  visibleRange: {
    start: INIT,
    end: moment(INIT).add(31,'days').format('YYYY-MM-DD')
  },
  buttonText: '31 jours'
}

和previous/next don't seem to work when visibleRange is defined for a custom view。

[我尝试了一些涉及jQuery的东西，但大多数情况下都起作用，除了您必须先在prev / next上单击两次以更改visibleRange（并且从上一个移至上一个，或从上一个移至另一个时，也必须单击两次）。

我想要这个：

calendar.setOption('visibleRange', {
  start: INIT, 
  end: INIT_END
})

要工作，但是在我的实现中，它只工作一次，当它被触发时，单击按钮不再起作用。

您可以在此CodePen上找到代码

你能帮我吗？

Answer 1

很好，一个同事的同事带领我找到了解决方案，非常感谢他。

而不是使用visibleRange并尝试使用jQuery处理FullCalendar的数据（非常粗略），我计算了我的两个时刻之间的时差以得到持续时间：

const INIT = moment().subtract(4, 'days');
const INIT_END = moment(INIT).add(27,'days');
let duration = INIT_END.diff(INIT, 'days')

然后我在customView的设置中使用此持续时间：

resourceTimelineRollingMonth: {
  type: 'resourceTimeline',
  duration: { days: duration },
  buttonText: '31 jours'
}

并且我的视图从当日前4天开始，在Calendar对象中，我设置了：

[...]
defaultDate: INIT.format('YYYY-MM-DD'),
[...]

现在哪个可以完美工作。