windowResize触发时更改视图

问题描述

我要在调整日历大小时更新Fullcalender视图。

我正在使用windowResize事件。

这就是现在的样子。

document.addEventListener('DOMContentLoaded',function() {
    var calendarEl = document.getElementById('kt_calendar');
    var calendar = new FullCalendar.Calendar(calendarEl,{
        plugins: [ 'bootstrap','interaction','dayGrid','timeGrid','list' ],defaultview: 'timeGridWeek',views: {
            timeGridWeek: {
                buttonText: 'week',dayCount: 4,duration: { days: 4 },},test: {
                buttonText: 'week',dayCount: 1,duration: { days: 1 },abc: {
                buttonText: 'week',dayCount: 2,duration: { days: 2 },}
        },windowResize: function(view) {
            this.changeView("test");
        }
    });
    calendar.render();
});

windowResize确实会触发，但出现此错误：

FullCalendar视图“测试”不存在。确保您的插件已正确加载

我定义的自定义视图不是正确的还是缺少什么？

解决方法

经过一些测试，似乎如果您使用$translator = $this->getServicelocator()->get('translator'); $translator->setLocale($locale);属性正确定义了自定义视图（如https://fullcalendar.io/docs/v4/custom-view-with-settings所述），则不会引发错误。

type

（N.B。timeGridWeek不需要使用它，因为您已经简单地覆盖了timeGrid插件中已经可用的视图名称）。

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

fullcalendar fullcalendar-4 javascript