Full Calendar 中的列如何分页？

Question

我正在使用 FullCalender 库。我需要使用 fullcalendar 的垂直资源视图将资源显示为列。现在，在网格中，我必须处理大量资源，网格可能有 50-100 列。

正如我们在上面的网格中看到的，我们只有 23 个资源，列变得非常拥挤。 但是，我想一次看到 5 个。第一次加载时，网格将显示 1-5 列。会有一个下一步按钮，如果我点击，网格将显示 6-10 列，然后是 11-15 等等。

上面的日历代码如下：

document.addEventListener('DOMContentLoaded', function() {
  var calendarEl = document.getElementById('calendar');
  var calendar = new FullCalendar.Calendar(calendarEl, {
     header: {
            left: '',
            center: '',
            right: ''
     },
    plugins: [ 'resourceTimeGrid' ],
    timeZone: 'UTC',
    defaultView: 'resourceTimeGridDay',
    resources: [
      { id: '1', title: 'Room 1' },
      { id: '2', title: 'Room 2'},
      { id: '3', title: 'Room 3' },
      { id: '4', title: 'Room 4' },
      { id: '5', title: 'Room 5' },
      { id: '6', title: 'Room 6'},
      { id: '7', title: 'Room 7' },
      { id: '8', title: 'Room 8' },
      { id: '9', title: 'Room 9' },
      { id: '10', title: 'Room 10'},
      { id: '11', title: 'Room 11' },
      { id: '12', title: 'Room 12' },
      { id: '13', title: 'Room 13' },
      { id: '14', title: 'Room 14'},
      { id: '15', title: 'Room 15' },
      { id: '16', title: 'Room 16' },
      { id: '17', title: 'Room 17'},
      { id: '18', title: 'Room 18' },
      { id: '19', title: 'Room 19' },
      { id: '20', title: 'Room 20' },
      { id: '21', title: 'Room 21'},
      { id: '22', title: 'Room 22' },
      { id: '23', title: 'Room 23' },
    ],
    events: 'https://fullcalendar.io/demo-events.json?with-resources=4&single-day'
  });
  calendar.render();
});

有没有办法在全日历中进行列分页？

Answer 1

你找到解决办法了吗？我一直在尝试不同的选择，但没能做到。