完整日历可记住所选视图和日期范围

Question

我希望完整日历调度程序能够记住当前视图和日期范围。我的视图可以正常工作，但它始终默认为当前日期。

代码片段：

var defaultView = (localStorage.getItem("fcDefaultView") !== null ? localStorage.getItem("fcDefaultView") : "timelineFiveDays");
var defaultStartDate = (localStorage.getItem("fcDefaultStartDate") !== null ? localStorage.getItem("fcDefaultStartDate") : null);
var defaultEndDate = (localStorage.getItem("fcDefaultEndDate") !== null ? localStorage.getItem("fcDefaultEndDate") : null);

$('#calendar').fullCalendar(
{    
    defaultView: defaultView,
    visibleRange:
    {
    start: defaultStartDate,
    end: defaultEndDate
    },
    viewRender: function(view, element)
    {  
    localStorage.setItem("fcDefaultView", view.name);
    localStorage.setItem("fcDefaultStartDate", view.start);
    localStorage.setItem("fcDefaultEndDate", view.end);
    }
}

非常感谢您的帮助

Answer 1

我终于通过使用 gotoDate 让它工作了

var defaultView = (localStorage.getItem("fcDefaultView") !== null ? localStorage.getItem("fcDefaultView") : "timelineFiveDays"); 
var defaultStartDate = (localStorage.getItem("fcDefaultStartDate") !== null ? localStorage.getItem("fcDefaultStartDate") : moment()); 
defaultView: defaultView, 
$('#calendar').fullCalendar('gotoDate', defaultStartDate); 

正如 @ADyson 提到的，我可能会尝试使用 defaultDate 而不是使用 goToDate 方法

Answer 2

恕我直言，问题是本地存储返回一个包含日期的字符串，而“initialDate”需要一个 Date 对象！我最终得到了这个解决方案（对于 Fullcalendar v6 init）：

var calendarEl = document.getElementById('myCalendar');
let calendar = new Calendar(calendarEl, {
   ....
   initialDate: ( localStorage.getItem("fcDefaultStartDate") !== null ? Date.parse(localStorage.getItem("fcDefaultStartDate")) : new Date() ),
   ...
}