2017-05-07 29 views
0

我正在使用Fullcalendar,並且需要使用timeline視圖顯示當前所有年份以及下一年的下兩個月。Fullcalendar:如何在時間表視圖中顯示明年的下兩個月

如果我用這種方式visibleRange選項:

visibleRange: function (currentDate) { 
return { 
    start: currentDate.year()+'-01-01', 
    end: currentDate.year()+1 + '-02-28', 
};} 

日曆顯示正確的時間,但導航按鈕「下一個」停止工作。

我也嘗試使用duration選項,但我不知道如何設置「開始」期間....日曆始終在當前日期開始。

我認爲有一個解決方案,不需要寫一個完整的自定義視圖來這樣做。

回答

1

解決方案包括設置dateIncrement的值 - 這告訴下一個/上一個按鈕在您自定義視圖範圍時多大程度增加/減少可見日期。

下面是一個例子。注:我已經使用了momentJS的內置函數,而不是字符串連接,以提供更可靠和更整潔的方式來設置可見範圍。將slotDuration設置爲不會產生大量長日曆的內容也可能是一個好主意。我用了一個月的時間作爲例子,但顯然你可以將它配置爲任何你需要的。

$('#calendar').fullCalendar({ 
    schedulerLicenseKey: 'GPL-My-Project-Is-Open-Source', 
    defaultView: 'timeline', 
    header: { 
     left: 'prev,next today', 
     center: 'title', 
     right: 'timeline' 
    }, 
    slotDuration: { months: 1 }, 
    dateIncrement: { years: 1 }, 
    visibleRange: function (currentDate) { 
     return { 
      start: currentDate.clone().startOf('year'), 
      end: currentDate.clone().startOf('year').add({ years: 1, months: 2}), 
     }; 
    }, 
    //...etc 
}); 

的dateIncrement設置記錄在這裏:https://fullcalendar.io/docs/current_date/dateIncrement/

相關問題