微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

如何解决更新日历用户界面以反映使用“ 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 举报,一经查实,本站将立刻删除。