更新日历用户界面以反映使用“ gotoDate”功能选择的新日期作为显示的第一个日期 精简测试用例错误说明

问题描述

精简测试用例

https://jsfiddle.net/ryj1023/5epnoguk/5/

HTML：

    <button
           onclick="updateDaterange()"
          >
            Click
          </button>
    <div id='calendar'></div>

JavaScript：

    const updateDaterange = () => {
     // calendar.gotoDate(new Date('11-04-2020')); // this will change the view because the date passed in the function isn't currently in view
     calendar.gotoDate(new Date('10-04-2020')); // this will not update the view with the passed in date as the first date in range because it's already in view
     }
     
     var calendarEl = document.getElementById('calendar');
     var calendar = new FullCalendar.Calendar(calendarEl,{
          events: [
            {
              id: 'a',resourceId: 'a',title: 'All Day Event',start: '2020-09-01',},{
              title: 'Long Event',start: '2020-09-07',end: '2020-09-10',],allDaySlot: false,displayEventTime: false,header: false,plugins: [ 'dayGrid','timeGrid','rrule'],defaultview: 'timeGridWeek',resourceOrder: 'sort',defaultDate: new Date('10-01-2020'),schedulerLicenseKey: 'GPL-My-Project-Is-Open-Source',views: {
            month: {
              type: 'dayGridMonth',week: {
              type: 'resourceTimeline',slotLabelFormat: [
                {
                  weekday: 'short',day: 'numeric',month: 'short',resourceLabelText: 'Property',duration: {
                days: 14,// getDefaultWeekDuration(start,end)
              },dateIncrement: {
                days: 1,slotDuration: '24:00:00',// eventRender: ({ date,el,view }) => {
          // },themeSystem: 'bootstrap',eventOverlap: false,contentHeight: 'auto',resourceAreaWidth: '10%',resources: [{ id: 'a',title: 'Auditorium A' }],});
     
     calendar.render();

错误说明

我正在尝试使用“ gotoDate”功能将日历的UI更新为，以便将传递给该功能的日期反映为所示范围的第一个日期。如果我在函数中传递的日期尚未在视图中显示的范围内，则此功能有效。当我选择一个显示当前范围内的日期而不是第一个日期时，UI不会更改。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）