Fullcalendar单击月份时间周等可获得当前视图

Question

无论何时触发事件，我都想知道日历的当前视图，例如dayGridMonth，timeGridWeek，timeGridDay或listWeek。

我有一个select元素，该元素在更改时试图更新日历上的事件。但是发生的是，如果我选择列表视图并更改选择菜单，则整个日历将刷新为默认视图。我想将日历设置为选择选择框之前的视图。

    calendar_view_session: function(){
        var calendar = new FullCalendar.Calendar(calendarEl, {
        plugins: ['dayGrid', 'timeGrid', 'list', 'interaction'],
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek'
        },

        defaultDate: moment().format('YYYY-MM-DD'),//'2019-04-12',
        navLinks: true, 
        defaultView: 'listWeek',
        eventSources: [{
                    events: function (info, successCallback, failureCallback) {
                        console.log(info);
                    },
                    ..........
            }
          ],
          ..........
  }
}



                <select name="select_meetingtype" id="select_meetingtype" class="form-control">
                    <option value="">All Sessions</option>
                    <option value="free_session">Free Sessions</option>
                    <option value="weekly_session">Classes</option>
                </select>

$('#select_meetingtype').on('change', function() {
  _this.calendar_view_session(this.value)
});

console.log(info)仅打印日期。

Answer 1

要抓取当前视图，试试这个：

const views = {day: 'timeGridDay', week: 'timeGridWeek', month: 'timeGridMonth', list: 'listWeek'};
var currentView = 'listWeek';
$('#calendar_container').delegate('.fc-toolbar-chunk button', 'click', function(){
  currentView = views[$(this).text()];
  calendar_view_session();// re-initialize calendar with current selectedView
})

calendar_view_session: function(){
    var calendar = new FullCalendar.Calendar(calendarEl, {
        //
        //
        defaultView: currentView,// use global var instead of static value
        //
        //etc.

这将使用当前视图重新初始化您的日历，而不是 恢复到默认值。由于更新事件时整个日历会被破坏并重新创建，因此需要委托。